vue3+ts中父组件怎么传值给子组件

在Vue3中，使用TypeScript (TS) 与组件通信通常有两种方法：props和自定义事件。

1. **Props（属性）**:
父组件可以通过`props`向子组件传递数据。首先，在父组件的模板中声明你需要传入的prop，并指定其类型：

   <ChildComponent :value="parentValue" :type="parentType" /> // 使用v-bind语法

在`ChildComponent.vue`的TS定义里接收这些props：

   import { Component, Prop } from 'vue';
   export default class ChildComponent extends Component {
       @Prop(String) value!: string;
       @Prop(Number | String) type!: any; // 类型可以更精确
   }

2. **自定义事件（emit）**:
如果需要双向绑定，或者从子组件触发动作并传递数据给父组件，可以使用`@emit`：

   this.$emit('update:value', newValue);

然后在父组件上监听这个事件：

   <ChildComponent @update:value="handleValueChanged" />

   import { defineEmits } from 'vue';
   const emits = defineEmits(['update:value']);
   function handleValueChanged(newValue) {
       console.log(newValue);
   }