vue-组件注册

<div id="app-7">
 <ol>
 <!--
 现在我们为每个 todo-item 提供 todo 对象
 todo 对象是变量，即其内容可以是动态的。
 我们也需要为每个组件提供一个“key”，稍后再
 作详细解释。
 -->
 <todo-item
 v-for="item in groceryList"
 v-bind:todo="item"
 v-bind:key="item.id">
 </todo-item>
 </ol>
</div>

Vue.component('todo-item', {
  props: ['todo'],
  template: '<li>{{ todo.text }}</li>'
})

var app7 = new Vue({
 el: '#app-7',
 data: {
 groceryList: [
 { id: 0, text: '蔬菜' },
 { id: 1, text: '奶酪' },
 { id: 2, text: '随便其它什么人吃的东西' }
 ]
 }
})

转载于:https://www.cnblogs.com/yanyan1114/p/8507709.html