Vue.js系列之vue-router(下)（5）

说明：

我们项目现在用的是：vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3
如果大家在实践的过程中与本文所说的内容有较大区别的话看看是不是版本问题。
本文是一系列文章，在我对Vue有了更深刻的理解认识之后会对文章及时进行修改或更正。欢迎大家批评指出错误。以下是已完成的文章列表。

1. Vue.js系列之项目搭建（1）
2. Vue.js系列之项目结构说明（2）
3. Vue.js系列之vue-router(上)（3）
4. Vue.js系列之vue-router(中)（4）

---

1.router-link的其他表现形式

有时候我们会这样去写，但是发现多了一个层级，而Vue提供了很好的方案。

<li>
	<router-link to="/mine">
		<i class="icon-nav icon-nav5"></i><span>我的</span>
	</router-link>
</li>

<router-link to="/mine" tag="li">		//tag指定标签名
	<i class="icon-nav icon-nav5"></i><span>我的</span>
</router-link>
<!-- 渲染结果 -->
<li>
	<i class="icon-nav icon-nav5"></i>
	<span>我的</span>
</li>

2.当前路由添加激活状态

还是看这张图，大家注意看到地址栏变化的同时，下面的tabBar也是相应的切换了状态的，这是因为vue-rout