问题分析
1 传递时机:如果父组件在子组件挂载之后更新 props 的值,那么 onMounted 钩子中访问到的将是初始值(可能是undefined 或空值)。
2 父子组件同步问题:可能是父子组件的同步问题,导致 props 没有正确传递。
解决方法
1.父子组件同步问题,检查父子组件中传递参数的命名、语法
2.传递时机,推荐在onMounted获取props中的值,改为watch
const props = defineProps({
id: {
type: String,
},
});
const data = ref([]);
//获取数据的函数
const fetchProjectArea = async (id) => {
const res: any = await getData({ id: id });//getData为数据库接口
data.value = res;
};
watch(
() => props.id, // 监听 id 的变化
async (newid) => {
await fetchProjectArea(newid);
}
);