2020-12-04：window.onresize 互相覆盖的问题、路径相关、vuedraggable、js判断对象是否为空对象的几种方法、阻止事件冒泡

1、window.onresize 互相覆盖的问题

①

window.onresize = this.chart.resize
...
 beforeDestroy() {
    window.onresize = null
  },

②

window.addEventListener('resize', () => this.chart.resize(), false)
...
  beforeDestroy() {
    window.removeEventListener('resize', () => this.chart.resize(), false)
  },

2、路径相关

//比如当前路径是home
this.$router.push({path:'name'})//==>path为/home/name
this.$router.push({path:'/name'})//==>path为/name

3、vuedraggable

安装
npm install vuedraggable
引入
import draggable from 'vuedraggable'

<draggable :list="list">
    <transition-group>
        <div v-for="element in list" :key="element.id">
            {{element.name}}
        </div>
    </transition-group>
</draggable>

属性：
list：效果同value。（type：array；default：null。）
option：
①group：用于分组，同一组的不同list可以相互拖动。（type：String/Array。）
②draggable：定义哪些列表单元可以进行拖放。（type：Selector。）

4、CSS 宽高度百分比数减去固定像素值的办法（例：100%-20px）

height:calc(100% - 20px);

注意：减号两边一定要打空格，不然会失效

5、js判断对象是否为空对象的几种方法

①

var data = {};
var b = (JSON.stringify(data) == "{}");

②

var data = {};
var arr = Object.getOwnPropertyNames(data);
alert(arr.length == 0);//true

③

var data = {};
var arr = Object.keys(data);
alert(arr.length == 0);//true

6、阻止事件冒泡

xxx(e) {
      e.stopPropagation()
    },