您当前的位置首页/Vue.js/ 正文

Element UI 重置表单无效?原来是这样!

admin 最后更新时间 2018-06-30 17:33:15   389浏览
重置表单老是无效,最后发现是没有写prop! 也就是说,除了要在表单上写上ref以便获取表单实体,还需要把药重置的选项加上prop才行,如果不加,就无法重置。 ### HTML ``` <el-form :inline="true" size='small' ref="searchForm" :model="searchForm"> <el-form-item prop='nickName'><!--这里要加prop--> <el-input placeholder="昵称" v-model="searchForm.nickName"></el-input> </el-form-item> <el-form-item prop='gender'><!--这里要加prop--> <el-select placeholder="性别" v-model="searchForm.gender"> <el-option label="全部" value=""></el-option> <el-option label="男" value="1"></el-option> <el-option label="女" value="2"></el-option> <el-option label="未知" value="0"></el-option> </el-select> </el-form-item> <el-form-item> <el-button type="primary" @click="onSearch">查询</el-button> <el-button @click="resetForm('searchForm')">重置</el-button> </el-form-item> </el-form> ``` ### JS ``` resetForm (formName) { this.$refs[formName].resetFields() } ```