<div id="app">
<p @mouseenter="enter" @mouseleave="leave">{{ message }}</p>
</div>

var vm = new Vue({
el: '#app',
data: {
message: '默认值'
},
methods: {
enter: function(e){
console.log(e);
this.message = '修改值';
},
leave: function(e){
this.message = '默认值111';
}
}
});

用vue实现元素获得鼠标焦点的功能,这里有两个方法,@mouseenter@mouseleave
@mouseenter 是值元素获得鼠标焦点后执行的方法,而@mouseleave 是当元素执行了 @mouseenter 离开之后执行的方法,两种都能获得元素DOM,从来用来修改元素的样式

转载于:https://www.cnblogs.com/qiuchuanji/p/8127453.html

Logo

前往低代码交流专区

更多推荐