vue+element-ui 表单的 el-input 第二次修改时无法输入

Akatsuki233

于 2019-07-10 16:47:20 发布

阅读量3.9k

点赞数 5

CC 4.0 BY-SA版权

分类专栏： js vue element-ui

本文链接：https://blog.youkuaiyun.com/Akatsuki233/article/details/95350817

vue 同时被 3 个专栏收录

46 篇文章

订阅专栏

40 篇文章

订阅专栏

element-ui

29 篇文章

订阅专栏

博客指出新增和修改使用同一弹窗时，修改提交要清空input框内的值。强调提交时不能仅将父对象formData设为空对象，正确写法是this.formData = {name: '' }，否则this.formData.name为undefined，会导致赋值不上。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

由于新增跟修改用的是同一个弹窗，所以当修改提交时，要清空 input 框内的值。

提交时不能只把父对象formData 设置为空对象。即this.formData = {} 是错误的

正确的写法为 this.formData = {name: '' }

原因：如果把this.formData设置为空，this.formData.name 就是 undefined，此时就会赋值不上。

     <el-form ref="popupContent" :model="formData" :rules="popupContentRules">
        <el-row>
          <el-form-item label="姓名" label-width="80px" prop="name">
            <el-input name="name" @keyup.native="judge" v-model="formData.name"/>
          </el-form-item>
        </el-row>
      </el-form>