vue使用路由router-link实现导航栏功能

Vue路由有什么作用?既然可以使用router-link进行单页面跳转,那就是说可以用来制作导航栏了,具体怎么操作?可以用li , button等标签吗?
答案是肯定的,使用router-link的时候,会默认渲染成router-link为a标签,如果想换成其他标签,可以使用router-link中的tag属性,router-link的常用属性详解可以看这里【vue中router-link属性的解析和用法】,在这里只讨论tag属性,设置了tag属性,router-link会被渲染成相应的标签,同样它还是会监听点击的功能。
例如:

< router-link to='/page1' tag='button'>第一页< /router-link> < router-link to='/page2' tag='button'>第二页< /router-link>

设置tag=‘button’,就会渲染成button标签。
vue使用路由router-link实现导航栏功能

文章图片
【vue使用路由router-link实现导航栏功能】要想渲染成其他标签,该方法也适用。

    推荐阅读