父子组件传值,子组件获取不到实例

vue3,后台管理增删改工作,应用在编辑页面,获取list row的record,然后后台获取promise数据,父组件动态给子组件传值,子组件在watch中监听父组件传过来的变量,然后setfieldsvalue给子组件的basicform,提示错误

img


父组件定义动态变量

img


父组件在弹出页面初始,获取后台数据

img


子组件接收父组件props,在watch中获取到数据,给basic form 赋值

img

有没有可能是你这个请求是异步的,还没返回数据之前就传了一个不知道什么玩意进去所以报错了

以下答案引用自GPT-3大模型,请合理使用:

实例

父组件:
// 设定动态变量
data() {
    return {
        formData: null // 子组件数据
    };
},
// 获取后台数据
mounted(){
    this.getData();
},
methods:{
    // 获取数据
    getData(){
        // 调用后台获取数据
        getDataFromServer().then(res=>{
            this.formData = res;
        })
    }
}

子组件:
props:{
    formData: '' // 接收父组件传来的数据
},
watch:{
    formData(newVal,oldVal){
        if(newVal){
            // 后台数据有值时,setFieldsValue给basic form
            this.basicForm.setFieldsValue(this.formData);
        }
    }
}

如果我的回答解决了您的问题,请采纳我的回答

延迟 设置 表单值 可以的话 ,就说明 你 设置的时候 表单还没渲染