在 vuejs 的按钮中包含 router-link 标记

Question

我可以在 router-link 标签中包装或附上 button 标签吗？

当我按下按钮时，我希望它引导我到所需的页面。

原文由 Kushagra Agarwal 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

您可以使用 tag prop 。

 <router-link to="/foo" tag="button">foo</router-link>

如果您使用 3.0+，请 使用 v-slot （感谢 Romain 和 Jeff ）

原文由 choasia 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

虽然这里的答案都很好，但似乎没有一个是最简单的解决方案。经过一些快速研究，似乎使按钮使用 vue-router 的真正最简单的方法是使用 router.push 调用。这可以在 .vue 模板中使用，如下所示：

 <button @click="$router.push('about')">Click to Navigate</button>

超级简单干净。我希望其他人觉得这很有用！

来源： https ://router.vuejs.org/guide/essentials/navigation.html

原文由 Wes Winder 发布，翻译遵循 CC BY-SA 4.0 许可协议