0

我正在尝试更新我的 Vue.js 数据（linkClicked）。

我将 URL 作为 Laravel 的道具传递到我的 Vue 组件中。这些道具附加到页面上的多个锚标记，其中包含来自道具的各种 URL。无论哪里有外部链接，我都附上了一个调用方法（showModal）的点击事件。例如，我的锚标签如下所示：

<a @click.prevent="showModal($event)" :href="extcontacturl">Contact Us</a>

在这种方法中，我将$event.target.href记录在控制台中，并且可以确认单击时我在控制台中看到了正确的链接。所以道具工作正常。我的脚本代码如下所示：

export default {
  props: [
    "extcontacturl",
  ],

  data() {
    return {
      linkClicked: undefined
    };
  },

  methods: {
    showModal($event) {
      this.linkClicked = $event.target.href;
      console.log($event.target.href);
    }
  }
};

但是我的数据中的linkClicked根本没有更新，我不确定我哪里出错了。

我期待的是linkClicked更新为道具表示的 URL 字符串。例如，如果extcontacturl设置为“ https://www.google.com/contact ”，那么我希望 linkClicked 在单击联系人链接时更新到此 URL。

4

1 回答 1

1

模板中不需要this。

应该是这样的：

<a @click.prevent="showModal($event)" :href="extcontacturl">Contact Us</a>
于 2020-01-21T13:21:35.933 回答