如何在 vue.js 中实现鼠标 hover(悬停)改变 background-color
vue.js 事件处理用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码。代码如下:<div id="demo"><div @mouseover="mouseOver"@mouseleave="mouseLea
·
vue.js 事件处理
用 v-on 指令监听 DOM 事件,并在触发时运行一些 JavaScript 代码。
代码如下:
<div id="demo">
<div @mouseover="mouseOver"
@mouseleave="mouseLeave"
:style="active">Hover over me!</div>
</div>
var demo = new Vue({
el: '#demo',
data: {
active: ''
},
methods: {
mouseOver: function(){
this.active = 'background-color: #cccccc';
},
mouseLeave: function () {
this.active = '';
},
}
});
更多推荐
已为社区贡献2条内容
所有评论(0)