Vue Props 声明

来自泡泡学习笔记
BrainBs讨论 | 贡献2024年1月30日 (二) 09:30的版本 (创建页面,内容为“ 一个组件需要显式声明它所接受的 props,这样 Vue 才能知道外部传入的哪些是 props,哪些是透传 attribute 。 在使用 <script setup> 的单文件组件中,props 可以使用 defineProps() 宏来声明: ```vue <script setup> const props = defineProps(['foo']) console.log(props.foo) </script></pre> 除了使用字符串数组来声明 prop 外,还可以使用对象的形式: <syntaxhighlight lang="js"…”)
(差异) ←上一版本 | 最后版本 (差异) | 下一版本→ (差异)
跳到导航 跳到搜索

一个组件需要显式声明它所接受的 props,这样 Vue 才能知道外部传入的哪些是 props,哪些是透传 attribute 。

在使用 <script setup> 的单文件组件中,props 可以使用 defineProps() 宏来声明:

```vue <script setup> const props = defineProps(['foo'])

console.log(props.foo)

</script>

除了使用字符串数组来声明 prop 外,还可以使用对象的形式:

// 使用 <script setup>
defineProps({
  title: String,
  likes: Number
})

对于以对象形式声明中的每个属性,key 是 prop 的名称,而值则是该 prop 预期类型的构造函数。比如,如果要求一个 prop 的值是 number 类型,则可使用 Number 构造函数作为其声明的值。