Vue實現hover功能

<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，從來用來修改元素的樣式