目录
懵逼的一个小时
之前用vue写router路由的时候，先配置一个路由表，然后再将配好的路由push到已有的组件里面，再通过<RouterView></RouterView>方法将每一个调用的路由的内容渲染到父组件要用的位置。
今晚我在用uni-app的时候，突然不想用uni-app自己提供的路由跳转方法：
uni.navigateTo我想用vue那种路由的跳转方式，我一开始想了想应该是可以的，毕竟uni-app的内核也是vue.js框架。所以，我开始安装第三方vue-router、配置main.js、创建router路由表配置页面路由等。
等我一顿操作后，我发现，wc！不太对，和vue不太一样。点击跳转的时候路径动，但是内容是不刷新的，一般遇到这种情况，在vue是父组件调用子组件是，父组件没有加：
<RouterView></RouterView>导致的，但是我想："我明明在父组件中加上了啊，为什么不行。"我有重新了一遍项目，还是不行。
uni-app与vue路由配置的不同
经过一个多小时后，我终于发现了问题：（uni-app与vue路由的不同）
- vue中只针对PC端而言，他的没有pages.json文件中所以不会自动定义此项目的路由的，所以，当我们用vue写路由时，要有手写路由表的这一重要步骤。
- uni-app是一款兼容流生态，虽然用的是vue框架的内核，但是配置路由却与vue不一样。因为uni-app中有pages.json的存在，它在创建每一个vue页面时都可以在pages.json中配置创建的vue页面路径。
- uni-app正因为有pages.json文件的存在，所以我们可以通过官方提供的uni.navigateTo等uniAPI接口去实现路由的跳转。
非官方接口的另类写法
如果不想用3.说的官方提供的api接口去实现跳转的话，我们可以直接使用this.$router.push实现路由的跳转，uni-app中使用它不会像vue中那么繁琐，它不需要开发者手动配置路由表。
错误编写：
父组件中：
index() {
this.$router.push('/index');
},main.js中：
import App from './App'
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI)
import Vue from 'vue'
import router from './router'
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App,
router
})
app.$mount()
router/index.js中：
import Vue from 'vue'
import Router from 'vue-router'
import index from '@/pages/houtai/index/index'
import Administrator from '@/pages/houtai/Administrator/Administrator'
import announcement from '@/pages/houtai/announcement/announcement'
import equipment from '@/pages/houtai/equipment/equipment'
import personal_center from '@/pages/houtai/personal_center/personal_center'
import user from '@/pages/houtai/user/user'
import worker from '@/pages/houtai/worker/worker'
Vue.use(Router)
export default new Router({
routes: [{
path: '/index',
component: index,
},
{
path: '/Administrator',
component: Administrator
},
{
path: '/announcement',
component: announcement
},
{
path: '/equipment',
component: equipment
},
{
path: '/personal_center',
component: personal_center
},
{
path: '/user',
component: user
},
{
path: '/worker',
component: worker
}
]
})正确编写（只需写父组件即可，其他是多余）：
父组件中：
说明：因为uni-app的所有的页面路由都给我配置到了pages.json文件中，所有我们没有必要再去手动写一遍路由表，我们直接用this.$router.push方法push到我们的页面的具体的路径就可以！
// 跳转首页
index() {
this.$router.push('/pages/houtai/index/index');
},
// 跳转个人中心
personal_center() {
this.$router.push('/pages/houtai/personal_center/personal_center');
},
// 跳转公告管理
announcement() {
this.$router.push('/pages/houtai/announcement/announcement');
},
// 跳转工作人员管理
worker() {
this.$router.push('/pages/houtai/worker/worker');
},
// 跳转用户信息管理
user() {
this.$router.push('/pages/houtai/user/user');
},
// 跳转馆内设备管理
equipment() {
this.$router.push('/pages/houtai/equipment/equipment');
},
// 跳转管理员管理
Administrator() {
this.$router.push('/pages/houtai/Administrator/Administrator');