关于vue父子间传递值

组件要想成为只能在父组件中使用的一个专属子组件，必须降级

-降级步骤

-1.子组件 var 组件名 使用驼峰命名法 比如 todoAdd****todoList
*

var todoadd={template：`
div...`}*,
data(){tetrun{}}

//data是个函数 需要数据间不相互干扰

2.父组件 可以直接使用 vue会自动把todoAdd转变成这样的形式，后面写上components：{组件名称}，比如components：{ todoAdd}

关于父子间值传递

子组件

子组件需要写入属性props：，props代表的意思是从父组件中获取数据，是个数组
起名尽量与父组件名称保持一致

 var todoAdd={
    template:`
    <ul>
    <li v-for="(task,i) of wan" :key="i">{{i+1}}-{{task}} <button>x</button></li>
</ul>
    `,
    props:["wan"],
    data(){
        return {

        }
    }, 
}

父组件

Vue.component(“todo”,{

    template:`
      <div>
      <h1>代办事件列表</h1>
      <todo-list> </todo-list>
      <todo-add :wan="tasks"> </todo-add>
      </div>
    `,data() {
        return {
            tasks:["吃饭","睡觉","打亮亮"]
        }
    },
     components:{todoAdd,todoList}
})

父组件中 ：代表我子组件需要这个，后面的wan尽量与tasks保持一致