zoukankan      html  css  js  c++  java
  • vue对List的删除和新增操作

    Vue对List的删除操作

    var vm = new vue({
        el: '#app'
        data: {
            id: ' ',
            name: ' ',
            list: [
                { id : 1, name : '奔驰', ctime: new Date() },
                { id : 2, name : '宝马', ctime: new Date() }
            ]
        },
        methods: { 
            delete(id) { //根据传入的ID来删除数据
                // 1.根据ID来找到要删除的这一项的索引
                // 2. 找到索引后,调用数组的splice方法
                // 方法一
                this.list.some((item, i) => {
                    if (item.id == id ){
                            this.list.splice(i,1)
                            // 在数组的some方法中,如果return true,就会立即终止这个数组的后续循环,所以相比较foreach,如果想要终止循环,那么建议使用some
                            return true;
                    }
                })
                // 方法二
                var index = this.list.findIndex(item => {
                    if ( item.id == id) {
                        return true;
                        }
            })
                this.list.splice(index,1)
            }
            // 方法三(不推荐,因为无法被终止)
            this.list.forEach(item => {
                if (item.id == id){
                    this.list.splice(i,1)
                }
            })
        }    
    })

    Vue对List的新增操作

    var car = { id : this.id, name: this.name}
    this.list.push(car)
  • 相关阅读:
    v-date
    文字在图片上
    v-生命周期
    彭博接口分类
    如何指定vim 的查找是从上往下还是从下往上[z]
    查看linux版本
    git web找不到new project解决方法
    比特币运行原理[z]
    [Z]haproxy+keepalived高可用群集
    blockchain good article
  • 原文地址:https://www.cnblogs.com/henuyuxiang/p/14690584.html
Copyright © 2011-2022 走看看