组件有自己独立的作用域！如果需要传递参数进入组件。需要通过props属性来声明。
<!DOCTYPE html><html><head><meta charset="utf-8" /><title></title><script src="js/vue.js"></script><style type="text/css"></style></head><body ><div id="todo-list-example"> <input v-model="newTodoText" v-on:keyup.enter="addNewTodo" placeholder="Add a todo" > <ul> <li is="todo-item" v-for="(todo, index) in todos" v-bind:title="todo" v-on:remove="todos.splice(index, 1)" ></li> </ul></div><script>Vue.component('todo-item', { template: '\ <li>\ {{ title }}\ <button v-on:click="$emit(\'remove\')">X</button>\ </li>\ 这种写法暂时不太清楚是怎么回事（'<li>{{ title }}<button v-on:click="$emit(\'remove\')">X</button></li>'这样写也行） ', props:['title'] })new Vue({ el: '#todo-list-example', data: { title:'', newTodoText: '', todos: [ 'Do the dishes', 'Take out the trash', 'Mow the lawn' ] }, methods: { addNewTodo: function () { this.todos.push(this.newTodoText) this.newTodoText = '' } }})</script></body></html>
