首页 新闻 会员 周边

表单和输入框怎么设置提交或重置后清空输入的内容

0
[已解决问题] 解决于 2022-04-26 17:19

element的form表单和input输入框怎么设置提交或取消后清空输入的内容

echomay的主页 echomay | 菜鸟二级 | 园豆:217
提问于:2022-03-19 22:10

可以写一个点击事件用来处理,可以设置状态,点击时状态发生改变,引起事件

奔跑的蜗牛mxl 2年前
< >
分享
最佳答案
0

使用element的清空表单:

 	<el-form :inline="true" :model="formInline" ref="formInline" class="demo-form-inline">
        <el-form-item label="供应商" prop="region">
          <el-select v-model="formInline.region" placeholder="请选择供应商">
            <el-option
              v-for="item in formList.companys"
              :label="item.prop"
              :value="item.value"
              :key="item.value"
            ></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注" prop="user">
          <el-input v-model="formInline.user" placeholder="请输入备注"></el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button @click="dialogVisible = false">取 消</el-button>
        <el-button type="primary" @click="onSubmit">确 定</el-button>
      </span>

另外在onSubmit,方法中加入 this.$refs.formInline.resetFields();

1、每一个el-form-item都需要加上prop,且prop的值要和它里面的input或者select绑定的值名称一直。
2、form表单需要加上ref,值和数据绑定的值一致
3、在调用resetFields()方法的时候this.$refs.formname.resetFields();
这里的formname填的是上面ref的值

奖励园豆:5
愚生浅末 | 菜鸟二级 |园豆:280 | 2022-03-21 09:57
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册