vue3.0父子传参，子修改父数据

父组件

父亲传值给儿子，儿子可以修改父亲的数据（同步）

<template>
  <div>
    父组件
    {{ data }}
    <button @click="add()">修改</button>
    <hr />
    子组件：<Son />
  </div>
</template>

<script>
import Son from "./components/Son.vue";
import { provide, ref, shallowRef ,readonly,shallowReadonly} from "vue";
export default {
  components: {
    Son,
  },
  setup() {
    let data = ref("123");
    let updata = () => {
      data += "==";
    };
    let add = ()=>{
      data+="=12"
    }
    provide("updata",updata);

    provide("show", data);
    return {
      data,
      updata,
      add
    };
  },
};
</script>

<style lang="less" scoped></style>

子组件

<template>
  <div>{{son}}</div>
  <button @click="updataSon(12)">更改</button>
</template>

<script>
import { ref,inject } from "vue";
export default {
  setup() {
    const son = (inject("show"));
    const updataSon = inject("updata")
    return{
        son,
        updataSon
    }
  },
};
</script>

<style lang="less" scoped></style>