vue 子组件获取从父组件(访问接口)传来的数据

本文讨论了在Vue中,子组件如何在父组件数据未从接口返回时避免空对象的问题。提出在子组件中使用`v-if`和判断标识,等待父组件接口数据加载完成后再显示。

有时候我们在写父子组件时,子组件需要接收从父组件传来的数据并展示,但会发现子组件拿到的对象为空,这是因为子组件执行 mounted 的时候,父组件那边访问接口还没有传来数据。
解决方法:给子组件加个判断标识,接口返回数据了才显示子组件
父组件代码

<el-tab-pane label="设备信息" value="first">
        <Inform  :ldata="info" v-if="basicFlag" />
      </el-tab-pane>
      
  devcieDetail({
        id: id,
      }).then((res) => {
        if (res.code == 200) {
          this.device = res.data;
          this.basicFlag = true;
        }
      });

子组件

  props: {

    ldata: {
      type: [Object]
    }
  },
  created() {
    this.Dinfo = this.ldata
  },

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值