vue2.0 v-bind的用法

<div id="app-7">  <ol>    <!-- 现在我们为每个todo-item提供待办项对象    -->    <!-- 待办项对象是变量，即其内容可以是动态的 -->    <todo-item v-for="item in groceryList" v-bind:todo="item"></todo-item>  </ol></div>

Vue.component('todo-item', {  props: ['todo'],  template: '<li>{{ todo.text }}</li>'})var app7 = new Vue({  el: '#app-7',  data: {    groceryList: [      { text: '蔬菜' },      { text: '奶酪' },      { text: '随便其他什么人吃的东西' }    ]  }})

这只是一个假设的例子，但是我们已经设法将应用分割成了两个更小的单元，子单元通过 props 接口实现了与父单元很好的解耦。我们现在可以进一步为我们的 todo-item 组件实现更复杂的模板和逻辑的改进，而不会影响到父单元。