vue路由

Posted 2020-09-07 吃草的虾米

1.同步路由

　　a.引入你想跳转的文件 import payment from ‘./app/payment‘

　　b.在路由里配置你的页面

　　const router = new VueRouter({
 　　 routes: [
    　　{name:‘payment‘,path:‘/payment‘,component: payment}  //path里的路径是指你浏览器显示的路径（例如http://localhost:9000/#/payment）
　　})
　c.调用你的路由（我的实例代码是写在一个方法里的）
　　payMent(){
　　   var obj={total:this.totalPrice}

　　　　router.push({

   　　　　name:"payment",
  　　　　 params:obj //这必须传对象，不然界面会获取不到你想要传的值
　　　　})
　　 }
2.异步路由
　　使用异步路由不需要引入文件，也就是同步路由中的a步骤不需要，
　　a.配置你要跳转的界面路由
　　　　const router = new VueRouter({ 
　　　　　　routes: [{name:‘payment‘,path:‘/payment‘,component:(resolve)=>{
　　
　　　　　　　　require.ensure([‘./app/payment‘],()=>{

 　　　　　　　　　　resolve(require(‘./app/payment‘))

      　　  })
   　　 }},
    
　　  ],
　　})