项目有一个主页面App.vue 结构
<template> <div id="app"> <router-view></router-view> </div> </template> <script> export default { name: 'app', data () { return { } } } </script>
项目目录结构有一个文件component文件夹 用来存放路由需要跳转的各个子页面
component文件夹下有
-- index.vue -- logon.vue -- register.vue
我想让页面初始化的时候,路由自动跳转到index.vue
目前我是这样写的
<template> <div id="app"> <router-view></router-view> </div> </template> <script> export default { name: 'app', data () { return { } }, created:function(){ this.$router.push('index'); // 页面加载时跳转 } } </script>
这样的方法虽然行得通,但是总觉得怪怪的,比如我一开始进入页面时 地址是 localhost/#/index
然后我跳转到 localhost/#/login
这时跳转到登录页面
如果我按下F5进行刷新,会跳回 localhost/#/index
有没有什么办法可以按下刷新之后继续停留在localhost/#/login
欧阳克2016-11-12 09:07:39
建议换一种方式注册路由,新建一个文件routers.js。引用时候这样
let router = new VueRouter({ hashbang: true, history: false, saveScrollPosition: true, transitionOnLoad: true }); import routerMap from './routers'; routerMap(router);
routers.js分开注册
router.map({ '/index':{ name:'index', component:function (resolve) { require(['index.vue'], resolve) } } }) router.map({ '/login':{ name:'login', component:function (resolve) { require(['login.vue'], resolve) } } })
这样每个页面都执行各自的代码