vue 学习笔记

今天研究了vux的demo

https://github.com/jinhuiWong/vux-2.0

将main.js中的路由文件提取到router/index.js中

整合代码

import router from './router/index.js'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
import router from './router/index.js'
引入时候出现了错误是因为下面定义了const router ,注释了之后生效
将注释代码整合到router/index.js中
import VueRouter from 'vue-router'

// var rootPath=config.build.assetsPublicPath;
var rootPath = "/";


/** -------------------------------------------------- 懒加载start --------------------------------------------*/

const Home = resolve => require(['../components/HelloFromVux.vue'], resolve)
const Demo = resolve => require(['../components/Hello.vue'], resolve)

/** -------------------------------------------------- 懒加载end --------------------------------------------*/
const router = new VueRouter({
  mode: 'hash',
  base: __dirname,
  //路由映射map
  routes: [
    {path: rootPath, component: Home, meta: {scrollToTop: true}, name: 'home'},
    { path: rootPath + 'demo', component: Demo , name: 'demo'},

    //找不到页面就返回404页面
    {
      path: '*',
      component: {template: '<p style="height:300px;text-align:center">404</p>'}
    }
  ]
});


export default router

访问localhost:8080时候home生效

访问:http://localhost:8080/demo

不生效

原因:要在demo前面加#,正确的访问方法http://localhost:8080/#/demo

后续研究#号的问题

 

 
posted @ 2017-04-19 14:28  sunniejs  阅读(861)  评论(0编辑  收藏  举报