element 封装的子组件调用父组件方法，该怎样写

Question

子组件

        <el-upload
          class="avatar-uploader"
          :action="UploadUrl()"
          :headers="{ Authorization: 'Bearer ' + $store.state.user.token }"
          name="img"
          :show-file-list="false"
          :on-success="onSuccessBg"
          :before-upload="beforeAvatarUpload"
        >
          <img v-if="compimgurl" :src="this.$store.getters.imgurl + compimgurl" class="avatar" />
          <i v-else class="el-icon-plus avatar-uploader-icon"></i>
          <i class="text">上传</i>
        </el-upload>

子组件方法

    onSuccessBg(res, file) {
      this.compimgurl = res.data;
      this.$emit('input', this.compimgurl);
      // // 上传成功后将图片地址赋值给裁剪框显示图片
      this.$nextTick(() => {
        this.showBoxs.cropImgShow1 = URL.createObjectURL(file.raw);
      });
      console.log('裁剪', this.showBoxs.cropImgShow1);
      //  this.$refs.clearKV.clearValidate();
      this.$parent.save(ruleForm);  //调用父组件方法,现在报错
    },

父组件方法

    save(ruleForm) {
      let that = this;
      this.$refs[ruleForm].validate(valid => {
        if (valid) {
          console.log('更新', that.ruleForm.picList);
          return false
          
        } else {
          console.log('error submit!!');
          return false;
        }
      });
    },

报错截图

Answer 1

1.this.$parent.save(ruleForm)，你这个ruleForm变量在这个onSuccessBg方法里并没有定义，肯定报错正确
2.可以看下emit() api