问答详情
源自:3-4 实现todo应用的业务逻辑

为什么可以在tabs组件里使用todo?

computed: {

   unFinishedTodoLength() {

     return this.todos.filter(todo => !todo.completed).length

   }

并没有向tabs组件传入todo,为什么可以使用

提问者:shi3476202 2018-03-06 12:09

个回答

  • qq__9608
    2018-06-11 10:28:03

    在父组件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

        }

    },


  • qq_asm_0
    2018-03-06 22:52:05

    父组件prop数据到子组件

    <Tabs 
       :filter="filter" 
       :todos="todos"
       @toggle="toggleFilter"
       @clearAll="clearAllcompleted"
     />