VUE 同时监听 多个事件,safari浏览器上异常

0 0 node.js javascript html
奇衡三
奇衡三

声望值:76 0人

2019-01-29 15:14:24 提问

关注 0关注

收藏 0收藏, 110浏览

safari浏览器上,触发 contextmenu右键 同时 会触发 click事件

google浏览器 触发 contextmenu右键 同时 不会触发 click事件

li 上 同时监听( mouseout mouseover contextmenu on:click)

    

{{item.name}}

屏幕快照 2017-12-17 下午12.10.17
clipboard.png

请先 登录 后评论

2个回答

  • 闭麦听歌1v9118声望 2018-09-25 09:27

    首先:safe浏览器上是指safari浏览器吗? 我做了在线例子,表示在safari上并没有出现右击会调用click的情况 demo 建议你先做一个简单的例子,在试一下。另外事件绑定最好都用@。 <div id="app"> <button @click="onClick" @contextmenu="onContextmenu"> click </button> </div> new Vue({ el: '#app', methods: { onClick () { console.log('onClick') }, onContextmenu () { console.log('onContextmenu') } } })
    请先 登录 后评论
  • 飞翔的熊bla45声望 2018-09-25 09:28

    根本还是没有解决,最后 采取 js 定时器 。 总结发现 阻止 @ contextmenu 事件向上冒泡,就会 触发 click事件 <template> <div class="indexContainer"> <ul> <li @click="onClick" @contextmenu="onContextmenu($event)"> click <ul> <li>test</li> </ul> </li> </ul> </div> </template> <script> export default { name: 'test', data() { return { } }, components: { }, created: function() { }, methods: { onClick () { event.preventDefault(); console.log('onClick') }, onContextmenu (event) { event.preventDefault(); console.log('onContextmenu') }, onMouseout() { console.log("onMouseout"); }, onMouseover() { console.log("onMouseover"); } } } </script>
    请先 登录 后评论

注册新账号

悬赏追问
10
  • 10
  • 20
  • 50
  • 100
  • 200
  • 输入数值
发布追问