父组件LoginWeb调用子组件CodeLogin

 <el-tab-pane label="验证码登录" name="second">
        <CodeLogin
          @refreshRsaKey="refreshRsaKey"
          :publicKeyCode="publicKeyCode"
        />
 </el-tab-pane>
...
async handleRSAKey() {
      const params = {
        data: {},
      };
      const { code, data } = await getRSAKey(params);
      if (code !== 0 || !data) {
        this.$message.error('系统异常,请刷新重试!');
        return;
      }
      this.publicKeyCode = data;
    },

由此可见传值的 publickey是通过接口异步拿到的,所以在子组件的mounted获取是undefined

那么我们加一个v-if, 让此值有值才可让他渲染, 有值后才走子组件的生命周期

      <el-tab-pane label="验证码登录" name="second">
        <CodeLogin
          @refreshRsaKey="refreshRsaKey"
          :publicKeyCode="publicKeyCode"
          v-if="publicKeyCode.length"
        />
      </el-tab-pane>
      v-if="publicKeyCode.length"
Logo

前往低代码交流专区

更多推荐