如何使用vue3组合API在父组件和子组件中绑定两个输入

npm install vue@next

<template>
  <div>
    <input v-model="input1" />
    <input v-model="input2" />
    <ChildComponent :input1="input1" :input2="input2" />
  </div>
</template>

<script>
import { ref } from 'vue';
import ChildComponent from './ChildComponent.vue';

export default {
  components: {
    ChildComponent,
  },
  setup() {
    const input1 = ref('');
    const input2 = ref('');

    return {
      input1,
      input2,
    };
  },
};
</script>

<template>
  <div>
    <p>输入1: {{ input1 }}</p>
    <p>输入2: {{ input2 }}</p>
  </div>
</template>

<script>
export default {
  props: {
    input1: {
      type: String,
      required: true,
    },
    input2: {
      type: String,
      required: true,
    },
  },
};
</script>

<template>
  <div>
    <ParentComponent />
  </div>
</template>

<script>
import ParentComponent from './ParentComponent.vue';

export default {
  components: {
    ParentComponent,
  },
};
</script>