uni-app 【报Bug】vue3 setup语法通过defineProps获取props为null，使用v2写法能正常获取

在 uni-app 中使用 Vue 3 的 setup 语法时，如果通过 defineProps 获取 props 为 null，而使用 Vue 2 的写法能正常获取，可能是由于以下原因导致的：

1. defineProps 的使用方式不正确

• 在 Vue 3 的 setup 语法中，defineProps 是一个编译时宏，用于定义组件的 props。确保你正确使用了 defineProps。

<script setup>
const props = defineProps({
  myProp: {
    type: String,
    required: true
  }
});

console.log(props.myProp); // 确保这里能正确输出
</script>

2. uni-app 的版本问题

• uni-app 对 Vue 3 的支持可能在不同版本中存在差异。确保你使用的 uni-app 版本支持 Vue 3 的 setup 语法。

• 你可以尝试更新 uni-app 到最新版本，或者检查是否有相关的 bug 修复。

3. props 传递问题

• 确保父组件正确传递了 props。如果父组件没有传递 props，或者传递的 props 名称不匹配，defineProps 可能会返回 null。

<template>
  <ChildComponent myProp="Hello World" />
</template>

4. setup 上下文问题

• 在 setup 函数中，props 是通过 defineProps 获取的，而不是通过 setup 的参数获取的。确保你没有混淆 setup 的参数和 defineProps。

<script setup>
const props = defineProps({
  myProp: String
});

console.log(props.myProp); // 确保这里能正确输出
</script>

5. Vue 3 的 props 类型定义问题

• 如果你在 defineProps 中定义了 props 的类型，确保类型定义正确。如果类型不匹配，可能会导致 props 为 null。

<script setup>
const props = defineProps({
  myProp: {
    type: String,
    required: true
  }
});

console.log(props.myProp); // 确保这里能正确输出
</script>