{{item.name}} _vue项目中如何获取window.event">
当前位置:   article > 正文

vue方法中获取event对象_vue项目中如何获取window.event

vue项目中如何获取window.event

前提:通过导航定位位置时,点击事件 用到a的href的hash,但需要取消a的默认动作,需要得到点击元素的event对象

html 代码

  1. <li v-for="(item,i) in navList" :key="i" @click="navPosition(item)">
  2. <a :class=item.className :href=item.href>
  3. <span>{{item.name}}</span>
  4. </a>
  5. </li>

navPosition方法 :

  1. navPosition(data) {
  2. event.preventDefault();
  3. var target = data.href;
  4. console.log(target)
  5. //jquery动画
  6. $('html, body').animate({
  7. scrollTop: $(target).offset().top
  8. }, 500);
  9. }

问题 :event 的值为 undefind

解决:

      1.当@click="navPosition"   方法名没有() 时 ,可以得到event;

      2.当@click="navPosition(data)"  使用圆括号,必须显式的传入event对象,如果不传入可能最终找到的是全局的window .event

即:本例解决代码如下

  1. <li v-for="(item,i) in navList" :key="i" @click="navPosition(item,$event)">
  2. <a :class=item.className :href=item.href>
  3. <span>{{item.name}}</span>
  4. </a>
  5. </li>
  1. navPosition(data,event) {
  2. event.preventDefault();
  3. var target = data.href;
  4. //jquery动画
  5. $('html, body').animate({
  6. scrollTop: $(target).offset().top
  7. }, 500);
  8. }

 

 

声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:【wpsshop博客】
推荐阅读