Vue+Element UI中的重置条件方法

如图，实现表单的创建、输入和重置

直接上代码

1.（表单创建 .vue）

<el-form :inline="true" :model="filters" ref="filters">
	<el-form-item prop="name">			
        <el-input v-model="filters.name" placeholder="姓名"></el-input>
			</el-form-item>
	<el-form-item prop="sex">
		<el-select v-model="filters.sex" placeholder="性别">
			<el-option v-for="item in sex" :value="item.value" :label="item.label">                        
            </el-option>
		</el-select>
	</el-form-item>
	<el-form-item prop="age">
		<el-input type="number" v-model="filters.age" min=0 placeholder="年龄"></el-input>
	</el-form-item>
	<el-form-item>
		<el-button type="primary" v-on:click="getUsers">查询</el-button>
	</el-form-item>
	<el-form-item>
		<el-button type="danger" @click="reset('filters')">重置</el-button>
	</el-form-item>
	<el-form-item>
		<el-button type="primary" @click="handleAdd">新增</el-button>
	</el-form-item>
</el-form>

2.表单初始化（.js）

data(){
    return {
        filters: {
					name: '',
					sex: '',
					age: ''
				},
				sex: [
					{value:'0',label:'女' },
					{value:'1',label:'男'}
                     ]
    }
}

3.重置表单（.js）

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

!!!重点注意：