element-ui中使用表单验证的问题

<el-form
    ref="ruleRules"
    :inline="true"
    :model="ruleInfo">
    <el-form-item label="规则名称">
        <el-input v-model="ruleInfo.ruleName" placeholder="请输入规则名称" clearable></el-input>
    </el-form-item>
        <el-form-item>
        <el-button type="primary" @click="search">搜索</el-button>
        <el-button @click="reset(ruleRules)">重置</el-button>
    </el-form-item>
</el-form>

methods() {
  reset (formname) {
      this.$refs[formname].resetFields()
  }
}

此时的js就会报错"this.$refs[formname]"未定义, 通过寻找后发现原来formname对应的是ref对应的值,所以把reset方法改一下即可

 1 <el-form
 2     ref="ruleRules"
 3     :inline="true"
 4     :model="ruleInfo">
 5     <el-form-item label="规则名称">
 6         <el-input v-model="ruleInfo.ruleName" placeholder="请输入规则名称" clearable></el-input>
 7     </el-form-item>
 8         <el-form-item>
 9         <el-button type="primary" @click="search">搜索</el-button>
10         <el-button @click="reset('ruleRules')">重置</el-button>
11     </el-form-item>
12 </el-form>