Question

我试图为匹配中的每个匹配呈现一些HTML，但是，我不确定<match v-for='match in matches' v-bind:match='match'></match>是否正确。

更具体地说，我不确定是否可以在循环v-bind:match='match'的同一元素上使用v-for='match in matches'。 match中包含的信息是否实际上是作为道具发送到组件的？

Answer 1

是的。这是一个有效的示例：

Vue.component('match', 
{
props :['match'],
template : `<div><span>{{match.matchName}}</span></div>`

})
var mapp = new Vue({
  el: "#app",
  data: {
    matches: [
      { matchName: "First Match"},
      { matchName: "Second Match"},
      { matchName: "Yet another Match"}
    ]
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.9/vue.js"></script>
<div id="app">
<match v-for='match in matches' v-bind:match='match'></match>
</div>

Answer 2

您正在做的是正确的Vue语法，将可以正常工作。 match可以作为组件match内部的属性。

但是，您可能想重命名变量。这是单行代码，已经开始令人困惑；-）。

<match v-for ='比赛中的比赛'v-bind：match ='match'> </match>是不正确的吗？我可以在相同元素的v-bind中使用v-for中的匹配吗？

2 个答案: