Cannot read property 'validate' of undefined

首先遇到BUG 不要慌,在vue表单提交的时候,我遇到了一个BUG,提示:
Cannot read property 'validate' of undefined

仔细审查表单代码,核对信息
表头:<el-form :model="valForm" :rules="rules" ref="valForm">
注意:

1. :model里面的单词,要与ref一样
2. :rules是验证用的不用改
3. v-model=里面也需要用valForm,比如valForm.name来取值
4. 提交按钮绑定click:
   <el-button type="primary" @click="submitEdit('valForm')">确 定</el-button>
注意,不能有空格

下面写法:

submitEdit(formName) {
    this.$refs[formName].validate((valid) => {
        if (valid) {
          axios.put(`http://127.0.0.1:8000/admin/sitenode/${this.valForm.id}`, this.valForm).then(res => {
              //初始化
              this.init();
              //关闭对话框
              this.dialogTableVisible = false;
          })
           } else {
               console.log('error submit!!');
                return false;
           }
          });
      },

后端写法:

public function update(Request $request, $id)
    {
        SiteNode::where('id', $id)->update($request->all());
    }

总结:遇到bug原因是因为我的:@click="submitEdit('valForm')"与ref`的值不同导致的
白天写BUG,晚上改BUG......