VUE的一些使用细节

在此总结我在使用vue的过程中遇到的小细节

事件

$event事件对象的获取

有的时候想在事件中传参，特别是环境的默认事件，比如浏览器中的点击事件

# html
<div @click="doSome">点击按键</div>
# js
methods:{
    doSome (e) {
        console.log(e); // event Object
    }
}

之前直接这么写

# html
<div @click="doSome('name')">点击按键</div>
# js
methods:{
    doSome (name, e) {
        console.log(name, e); // name undefined
    }
}

并拿不到事件对象 实际应该这么写

# html
<div @click="doSome($event, 'name')">点击按键</div>
# js
methods:{
    doSome (e, name) {
        console.log(e, name); // event Object name 
    }
}

这么写有点问题，在IE11下表现有点不同，传$event有点问题，可以试试event

在我忘记了$event的时候，我是怎么处理的

# html
<div @click="doSome" data-name="name">点击按键</div>
# js
methods:{
    doSome (e) {
        console.log(e.target.dataset.name); // name 点击事件绑定的对象上的自定义属性
    }
}