computed: {
unFinishedTodoLength() {
return this.todos.filter(todo => !todo.completed).length
}
并没有向tabs组件传入todo,为什么可以使用
在父组件todo.vue中:
<tabs @toggle="toggleFilter"
:filter="filter" //在这里把filter传给子组件tabs
:todos="todos" //在这里把todos传给子组件tabs
@clearAllCompleted="clearAllCompleted"
/>
在子组件todo.vue中:
props: { //通过props这个属性把父组件要传过来的数据传过来
filter: { //这个是父组件数据filter
type: String, //定义filter传过来的类型
required: true //是否必须要filter这个数据,true就是必须要
},
todos: {
type: Array, //定义todos传过来的类型
required: true
}
},
父组件prop数据到子组件
<Tabs :filter="filter" :todos="todos" @toggle="toggleFilter" @clearAll="clearAllcompleted" />