vue.js - 在插值哈巴狗模板中使用 Vue 道具

Question

这是我使用 Vue/Pug 组件的第一周。我有这个哈巴狗模板：

p(v-if="firstProduct")
  Product indeed exists {{ firstProduct }}
  - var foo = "bar"
  a.btn.btn-primary(@click=`redirect('products/${foo}/${firstProduct}')`) Go to the Product page

firstProduct是我传递给组件的 Vue.js 道具。我可以看到字符串：

   Product indeed exists my-really-cool-product

所以变量firstProduct存在并且具有正确的值，但是如果我单击链接，我会进入“/products/bar/undefined”。打印了本地变量，但道具就像不存在一样。我尝试了几种方法来“打印”变量，但显然是 JavaScript 模板或：

 "redirect('products/" + firstProduct +"')"

只是不工作。为什么本地 var 有效但 prop 无效？需要我“v-bind”一些东西吗？

标签： vue.jspug