在 vue中组件的传值方式
第一种:子传值给父(Mylist(子),App(父))
App组件:
要先(App..)中 写一个方法 ,这个方法用来值子组件中调用的,因为父亲定义一个方法 ,在孩子里面调用的时候,孩子才可以把参数传当做方法的实参,从而可以把参数传到父组件的方法 里面,然后父组件就可以拿这个 组件进行 操作
<MyList :juges="juges"></MyList>
methods:{
juges(id) {
this.todos.map((item) => {
if (item.id === id) {
item.done = !item.done;
}
});
},
},
Mylist组件:
click(id) {
//.方法的调用
this.juges(id);
},
接收父传过来的属性
props: ["juges"],
第二种:父传值给子 (Mylist(子),App(父))
App组件
例如传data 中的数据
<MyList :todo="todos"></MyList>
data(){
return {
todos: [
{ id: "001", title: "跳舞", done: true },
{ id: "002", title: "唱歌", done: false },
{ id: "003", title: "跑步", done: true },
],
};
}
Mylist组件
然后在这个组件中 就可以通过 this.todo 来使用 App组件(父组件)中传过来的值了
props:['todo']