当前位置: 首页 > Web前端 > vue.js

使用v-model实现父子组件双向通信

时间:2023-03-31 20:22:53 vue.js

prop是单向绑定:当父组件的属性改变时,会传递给子组件,反之则不行。这是为了防止子组件无意中修改父组件的状态——这会使应用程序的数据流难以理解。此外,每次更新父组件时,子组件的所有props都会更新为最新值。这意味着您不应该更改子组件内的道具。如果你这样做,Vue会在控制台中警告你。父组件和子组件直接传值会出现一些小问题,尤其是动态传值//Subcomponentexportdefault{name:'',props:{//通过value获取绑定消息值value:{type:String,default:''}},data:{},methods:{changeMes??sage(){//通过触发组件的input事件改变message值,//此时父组件中的message值会被改变为你的值设置this.$emit('input','yourmessagevalue')}}})