Vue nuxt-link不会触发方法

时间:2019-11-30 02:50:31

标签: jquery vue.js nuxt

有一种方法我希望在单击nuxt-link时将其触发 在这种情况下,可以从其他任何页面访问主页。 单击该图像后,该图像将不会立即显示,然后再次单击它就会显示。 当我点击nuxt链接中的主菜单时,我看了看DOM,然后它遍历了一个我不知道它来自何处的标签。

<template lang='pug'>

  header(class='header' name='top')
    div(class='header__logo')
      NLink(to='/' ) ABSYNTH
    nav(class='header__nav')
      ul(v-on:click='refreshImg')
        li(class='close-dropdown')
          NLink(to='/') Home
        li(class='close-dropdown')
          NLink(to='services') 서비스
        li(class='header__submenu no-dropdown')
          NLink(to='/') Services
          ul
            li(class='close-dropdown')
              NLink(to='/카톡문의') 카톡문의
            li(class='close-dropdown')
              NLink(to='/') Link 2
            li(class='close-dropdown')
              NLink(to='/') Link 3
            li(class='close-dropdown')
              NLink(to='/') Link 4
        li(class='close-dropdown')
          NLink(to='/카톡문의') 카톡문의  
        li(class='header__submenu no-dropdown')
          NLink(to='/') Portfolio
          ul
            li(class='close-dropdown')
              NLink(to='/') Link 1
            li(class='close-dropdown')
              NLink(to='/') Link 2
            li(class='close-dropdown')
              NLink(to='/') Link 3
            li(class='close-dropdown')
              NLink(to='/') Link 4
        li(class='close-dropdown')
          NLink(to='/예약') 예약
    div(class='header__menu-toggle') ☰
</template>

<script>
export default {
  methods: {

    refreshImg() {
      const baseUrl = "https://res.cloudinary.com/dti9z2dmx/image/fetch";
      Array.from(document.querySelectorAll("[data-img]")).forEach(function (img) {
        const { clientWidth, clientHeight } = img;

        const pixelRatio = window.devicePixelRatio || 1.0;

        const imageParams = `w_${100 * Math.round((clientWidth * pixelRatio) / 100)},h_${100 * Math.round((clientHeight * pixelRatio) / 100)},c_auto,c_fill,f_auto`;
        const url = `${baseUrl}/${imageParams}/${img.dataset.img}`;

        $(img).attr('src', url);
    });

    }
  }
};
</script>

0 个答案:

没有答案