Vue Cli3.0 事件绑定箭头函数无法正确获取到this

Question

模板代码<div style="position:absolute"     :style="{         width:width+'px',         height:height+'px',         left:left+'px',         top:top+'px',         backgroundColor     }"     @mousedown="onMouseDown($event)"></div>脚本代码methods:{        onMouseDown:(e)=>{            let count = 0;            this.inDragging = true;//这里的this指定元素而不是期望的组件实例             window.addEventListener('mousemove',this.onDragging);         }, }

Answer 1

原因：箭头函数的 this 的指向机制

解决：不要用箭头函数

    onMouseDown(e) {        let count = 0;        this.inDragging = true; 
        window.addEventListener('mousemove',this.onDragging);
    },