vue使用对象进行父子组件双向绑定

<div id="app">
  <children :obj="obj"></children>
</div>
<script src="../js/vue.js"></script>
<script>
  Vue.component('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>

//父组件
<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 }>();