Vue.js CSS更改按钮onClick以使href无法正常工作

Question

在SinglePageApp中，我需要使用<button>代码而不是<a>代码5我正在使用UKit

<a>标记为：

<a type="button" class="uk-button uk-button-link" href="#events"><events</a>

但是以这种方式编写标签不起作用

 <button @click="location.href='{{ url('events') }}'" class="uk-button uk-button-link">EVENTS</button>

注意：我看到一个ESLint错误.. [js]';'预期

Answer 1

@webnoob答案是正确的，但似乎它不能在单页面应用程序中工作：我得到一个scopelocation未定义错误..

所以我正在使用一种方法：

methods: {
    goToEvents: function () {
        location.href='#events'
    }
},

和

pywinauto==0.6.3

Answer 2

要使用Vue进行onclick，你可以这样做：

<button v-on:click="location.href=url('events')" class="uk-button uk-button-link">EVENTS</button>

您也可以使用@click="location.href=url('events')"

请查看Vue Event Binding了解详情。

如果您在表单中并且不希望也发布表单，则还需要添加.prevent以便它成为v-on:click.prevent="url('events')"

当您渲染内容即文本时，您只使用{{ }}（胡须）。当您在要使用动态值的属性中时，您将在属性前加:，因此，例如，如果您想在数据属性中添加一些动态文本，它将变为{{ 1}}