时间戳

首页 > 解决方案 > 从方法中获取目标元素（无事件）

javascript - 从方法中获取目标元素（无事件）

问题描述

我有一个包含各种链接的侧边栏

<sidebar-link href="/dashboard" icon="HomeIcon" :is-active="isActive()" />
<sidebar-link href="/test" icon="TestIcon" :is-active="isActive()" />

如果我给isActive('/dashboard')它，它会根据 currentUrl 返回真/假，它工作正常。

然而，由于这个属性已经存在于元素（href标签）上，我在想是否有可能在这个函数中获取当前元素。

我试过了：

<sidebar-link href="/dashboard" icon="HomeIcon" :is-active="isActive($event)" />

methods: {
   isActive(e) {
      console.log(e); // this returns undefined
   }
}

有没有办法传递目标元素，以便我可以使用 likee.target.href以减少重复。

标签： javascriptvue.jsvuejs2

解决方案

您可以像这样使用$refs来定位特定元素

<sidebar-link ref="fancySidebarLink" />

methods: {
   isActive(e) {
      console.log(this.$refs.fancySidebarLink)
   }
}

您还可以v-for在所有侧边栏链接上并在每次迭代时调用您的初始函数！( isActive)

推荐阅读