vue动态输入框

vue动态输入框
  //页面例子部分
       <tr v-for="(item,index) in 你的数组">

            <td>规格:{{index+1}}</td>
            <td>
                <input placeholder="请输入规格参数" v-model="item.字段">
                <input placeholder="请输入价格" v-model="item.字段">
                <input placeholder="请输入库存" v-model="item.字段">
                <button type="button" @click="downObj(item)">—</button>
                <button v-if="index==你的数组.length-1" type="button" @click="addObj()">+</button>
            </td>
        </tr>

//vue的 methods:内容加入两个方法

          /**
             * 添加一个
             */
            addObj: function () {
                //加一个
                this.你的数组.push({})
            },
            /**
             * 减少一个
             */
            downObj: function (item) {
                //长度是否大于1
                if (this.你的数组.length > 1) {
                    //获取下标减1
                    let indexOf = this.你的数组.indexOf(item);
                    this.你的数组.splice(indexOf, 1);
                } else {
                    alert("必须保留一个");
                }
            },
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容