vue3 elementplus reset重置表单表单需加上ref属性
字段需加上prop属性
<template> <div class="main"> <el-form ref="resetformdata" :model="forminline"> <el-form-item label="姓名" prop="customername"> <el-input v-model="forminline.customername" placeholder="请输入姓名" ></el-input> </el-form-item> <el-button type="warning" @click="resetform">重置</el-button> </el-form> </div></template>
<script>import { definecomponent, reactive, ref } from "vue";export default definecomponent({ setup() { const resetformdata = ref(null); const forminline = reactive({}); const resetform = () => { resetformdata.value.resetfields(); }; return { resetform, resetformdata, forminline, }; },});</script>
vue3 elementplus 踩坑表单重置按钮resetform失效在项目中,根据以往的经验编写了重置按钮,但发现它无法正常工作,即使替换为原生的重置按钮也没有效果。后来发现还是版本移植的问题。
vue2.0和vue3.0的语法不一样,在main.js中引入resetform函数时语法出错
// vue2.0 vue.prototype.resetform = resetform; //vue3.0 let app = createapp(app); //... app.config.globalproperties.resetform = resetform;
以上就是vue3与elementplus reset重置表单问题怎么解决的详细内容。