vue父子组件传值，子组件不难直接修改父组件的值，所以都是用emit去修改。
vue也提供了.sync和v-model组件传值的语法糖，可以更快的修改，但总归是要使用emit。
这次做项目，发现了一个可以直接双向绑定到input的方法，那就是直接传递对象，用深浅拷贝的原理，直接双向绑定。
直接引入vue2.x试了一下：
<div id="app"><children :obj="obj"></children></div><script src="../js/vue.js"></script><script>ponent('children', {template: `<div><input v-model="obj.a"/></div>`,model: {prop: 'obj'},props: ['obj'],computed:{objChild(){return this.obj;}},})new Vue({el: '#app',data(){return {obj: {a: 10},}},watch: {'obj.a'(cur){console.log(cur);}}})</script>
在vue3也试了一下：
//父组件<HelloWorld :obj="obj" />let obj = ref({ a: 10 });watch(obj.value, (cur: any) => {console.log(cur.a);});//子组件<input type="text" v-model="obj.a" />const props = defineProps<{ obj: any }>();
vue父子组件直接是单向数据流，是单向下行绑定，目的是防止从子组件意外变更父级组件的状态，从而导致你的应用的数据流向难以理解。
所以通过传对象进行双向绑定，有点旁门左道，但是在你明确自己在做什么的场景下，使用起来会更简单快捷，看个人选择吧。
欢迎关注订阅号 coding个人笔记
