vue3-props父子通信之双向绑定格式书写

先在son子组件定义props

props:{
	message: { type: String ,default: ''},//正常书写
	arr: { type: Array, default: () => [] },//接收数组
	obj: { type: Object, default: () =>({name:''}) },//接受对象
	obj: { type: Function},//接受函数
}

然后子组件通过computed监听双向绑定

emits: ['update:message'],
 setup(props, { emit }) {
  const thisMessage = computed({
      get: () => props.message,
      set: (val) => {
        emit('update:message', val);
      }
    });
    return{
		thisMessage 
	}
}

子组件里面的元素绑定

<input v-model="thisMessage "/>

接下来就是父组件引用

<son v-model:message="message"></son>

---

以上是正常写法 接下来是 jsx 写法 除了绑定不一样 其他都一样
先是子组件

 render() {
    return (
    <input v-model={[this.message,'value']} />
	);
  },

父组件

 render() {
    return (
    <son v-model={[this.message,'message']} ></son>
	);
  },