array.property.filter()方法创建一个新数组，其包含通过所提供函数实现的测试的所有元素。

filter()函数语法

const words = ['spray', 'limit', 'elite', 'exuberant', 'destruction', 'present'];

const result = words.filter(word => word.length > 6);

console.log(result);
// expected output: Array ["exuberant", "destruction", "present"]

在vue实例中使用es6新语法和filter()函数将除了click的id项之外的其他item项数组加载，利用v-on事件绑定指令，v-for列表渲染指令，从而实现删除的功能。

 <!-- 表格区域 -->
        <div id="apptable">
            <table class="table table-hover table-striped table-bordered border-secondary">
                <thead>
                    <td>#</td>
                    <td>品牌名称</td>
                    <td>状态</td>
                    <td>创建时间</td>
                    <td>操作</td>
                </thead>
                <tbody>
                    <tr v-for="(item,index) in list" :key="item.id">
                        <td>{{item.id}}</td>
                        <td>{{item.name}}</td>
                        <td>
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDefault" v-model="item.status">
                                <label class="form-check-label" for="flexSwitchCheckDefault" v-if="item.status">已启用</label>
                                <label class="form-check-label" for="flexSwitchCheckDefault" v-else="'item.status">已禁用</label>
                            </div>


                        </td>
                        <td>{{item.time}}</td>
                        <td>
                            <a href="javascript:;" @click="remove(item.id)">删除</a> </td>
                    </tr>
                </tbody>
            </table>
        </div>

   <div id="app">
   <!-- 表格区域 -->
        <div id="apptable">
            <table class="table table-hover table-striped table-bordered border-secondary">
                <thead>
                    <td>#</td>
                    <td>品牌名称</td>
                    <td>状态</td>
                    <td>创建时间</td>
                    <td>操作</td>
                </thead>
                <tbody>
                    <tr v-for="(item,index) in list" :key="item.id">
                        <td>{{item.id}}</td>
                        <td>{{item.name}}</td>
                        <td>
                            <div class="form-check form-switch">
                                <input class="form-check-input" type="checkbox" role="switch" id="flexSwitchCheckDefault" v-model="item.status">
                                <label class="form-check-label" for="flexSwitchCheckDefault" v-if="item.status">已启用</label>
                                <label class="form-check-label" for="flexSwitchCheckDefault" v-else="'item.status">已禁用</label>
                            </div>


                        </td>
                        <td>{{item.time}}</td>
                        <td>
                            <a href="javascript:;" @click="remove(item.id)">删除</a> </td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
    <script src="./lib/vue.js"></script>

    <script>
        // 创建vue实例
        const vm = new Vue({
            el: "#app",
            data: {
                // 品牌列表
                list: [{
                    id: 1,
                    name: '宝马',
                    status: true,
                    time: new Date()
                }, {
                    id: 2,
                    name: '奥迪',
                    status: true,
                    time: new Date()
                }, {
                    id: 3,
                    name: '奔驰',
                    status: true,
                    time: new Date()
                }, {
                    id: 4,
                    name: '宝马',
                    status: true,
                    time: new Date()
                }, ]
            },
            methods: {
                remove(id) {
                    // console.log('删除成功');
                    // filter()是es6里面的新的用法，用来遍历新的数组
                    this.list = this.list.filter(item => item.id !== id)
                }
            }
        })

   this.list = this.list.filter(item => item.id !== id)是精髓，将数组中只有和参数id不一样的item项v-for列表循环出来。进而实现了删除功能