今天完成的事：

一、vue对数组或对象更新的重新渲染

使用Vue.set（）或this.$set()

区别在于Vue.set()是将set函数绑定在Vue构造函数上，this.$set()是将set函数绑定在Vue原型上。

在对数组或对象进行操作时（如重新赋值），vue是无法检测到数据变化的，视图中的数据也不会实时更新，这时候需要用到set（）方法

对象：set（'target', 'key','value'）

数组：set('target','index','value')

二、实现表格行的互换

<table>
    <tr>
        <th>序号</th>
        <th>姓名</th>
        <th>年龄</th>
        <th>等级</th>
    </tr>
    <tr v-for="(x, index) in list" @dragstart="down(index)" @dragover="allow(event)" @drop="up(index)" draggable="true" >
        <td>{{ index+1 }}</td>
        <td>{{ x.name }}</td>
        <td>{{ x.age }}</td>
        <td>{{ x }}</td>
    </tr>
</table>

methods: {
    down(e){
        console.log(e);
        this.start = e;
        this.startInfo = this.list[e]
    },
    up(ev){
        console.log(ev);
        this.end = this.list[ev];
        Vue.set(this.list, this.start, this.end);
        Vue.set(this.list, ev, this.startInfo);
        console.log(this.list);
    },
    allow(event){
        event.preventDefault();
    },

需要使用ondrag等一系列的拖动事件

关键点在于ondragover事件

通过点击和松开鼠标两个事件，获取交换列表行的index，然后使用Vue.set（）方法交换数组中的数据

遇到的问题：

暂无

明天计划：

准备评审

收获：

组件不是万能的，有时候使用组件反而让一些功能难以实现，在选择组件时要考虑好功能的实现