vue中如何获取input输入的值并新增添加到表单中

爬楼梯的小新

已于 2023-07-14 15:22:27 修改

阅读量3.8k

点赞数 1

分类专栏： vue 文章标签： javascript

于 2022-03-10 18:04:03 首次发布

本文链接：https://blog.csdn.net/weixin_57607714/article/details/123406499

版权

vue 专栏收录该内容

62 篇文章 1 订阅

订阅专栏

设置v-model.trim 修饰符消除空格

 <input type="text" v-model.trim="brand">
 <button @click="add">添加</button>

新增按钮方法代码:

(因为object对象是键对值的形式所以是冒号:)

    add() {
      console.log(this.brand);
      if (this.brand != "") {  //如果输入的值不为空
        let obj = {
          id: this.nextId,
          name: this.brand,
        };
        this.list.push(obj);
        this.brand = "";
        this.nextId++;
      } else {
        alert('请输入..')
      }
    },