vue2.0怎样绑定原生DOM事件,如mouseover,scroll?

Question

vuer如何绑定原生DOM事件?

a.vue
<template>
    <div class="hospital-info">
        <div id="box" ref="box"></div>
    </div>
</template>


<script>
    export default {    
        mounted(){
            var box = this.$refs.box;
            box.addEventListener('mouseover',()=>{
                alert(1);
            })
        }
    }
</script>

<style>
    #box {
        width: 200px;
        height: 200px;
        background-color: #f00;
    }
</style>

效果:但数据移入红色区域时,alert(1).但是,实现不了?
用原生js,用Jquery操作,都不行!如何给固定DOM绑定DOM的原生事件,如mouseover,scroll;

Answer 1

  <div  @mouseover='test'>
  </div>

  methods:{
      test(){
          window.alert()
      }
  }

官方文档

Answer 2

@mouseover = "methodName" @scroll = "methodName"

Answer 3

额，可以试试自定义指令

Vue.directive('指令名',function(){
     //写一些监听事件
})
<div v-指令名 ></div>

以上是本人一点愚见

Answer 4

直接@就行了