vue3+ts中组件接收props
在Vue 3和TypeScript组合式API中，接收props的方法如下：
首先，在父组件中定义要传递的props：
<template>
<ChildComponent :myProp="value" />
</template>
<script setup lang="ts">
import { ref } from 'vue'
import ChildComponent from './ChildComponent.vue'
const value = ref('Hello, World!')
</script>然后，在子组件中使用defineProps函数来定义接收的props：
<template>
<div>{{ myProp }}</div>
</template>
<script setup lang="ts">
const props = defineProps<{
myProp: string
}>()
</script>如果你想要为props设置类型并添加一些验证逻辑，可以使用TypeScript的接口：
interface MyProps {
myProp: string
}
const props = defineProps<MyProps>()确保在<script setup>标签中使用lang="ts"以启用TypeScript支持。
评论已关闭