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方法改一下即可

 <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>