防止 Vue 路由器中的路由更改

Question

<router-link to="SOME_ROUTE">
    <div class="outer-div">
        <div class="inner-div" v-on:click="doSomething"></div>
    </div>
</router-link>

有些我正在尝试创建一个 link，其中将有一个图像。我试图让内部 div 在不触发路由更改的情况下做某事，我如何才能实现这一目标？我试过事件修改v-on:click.stop，但是好像不行，点击.inner-div后路由还是会变。在此先感谢您的帮助。

Answer 1

我想你只需要使用

<div class="inner-div" v-on:click.prevent="doSomething"></div>

而不是

<div class="inner-div" v-on:click.stop="doSomething"></div>

防止默认操作。参见：
这是 demo.

Prevent route change in Vue router