Vue 随笔1-加入vue router 后发现app被渲染了2次
原因:main中已经render了app,在route中不需要再加入app组件了,直接重定向到home即可main.jsimport Vue from 'vue'import App from './App.vue'import VueRouter from 'vue-router'import routes from './router/router'Vue.config.prod...
·
原因:main中已经render了app,在route中不需要再加入app组件了,直接重定向到home即可
main.js
import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import routes from './router/router'
Vue.config.productionTip = false
Vue.use(VueRouter)
const router = new VueRouter({
mode: 'history',
routes
})
new Vue({
router,
render: h => h(App)
}).$mount('#app')
route.js
const home = r => require.ensure([], () => r(require('../page/home/index.vue')),'home');
const hello = r => require.ensure([], () => r(require('../page/hello/index.vue')),'hello');
const hi = r => require.ensure([], () => r(require('../page/hi/index.vue')),'hi');
const wawa = r => require.ensure([], () => r(require('../page/wawa/index.vue')),'wawa');
export default [{
path: '/',
redirect:'home'
},{
path:'/home',
component:home
},{
path:'/hello',
component:hello,
children:[{
path:'hi',
component:hi
}]
},{
path:'/wawa',
component:wawa
}
]
App.vue
<template>
<div id="app">
<router-view></router-view>
</div>
</template>
main.js
import Vue from 'vue'
import App from './App.vue'
import VueRouter from 'vue-router'
import routes from './router/router'
Vue.config.productionTip = false
Vue.use(VueRouter)
const router = new VueRouter({
mode: 'history',
routes
})
new Vue({
router,
render: h => h(App)
}).$mount('#app')
转载于:https://blog.51cto.com/12708284/2319118
更多推荐
已为社区贡献2条内容
所有评论(0)