首页 > 其他 > 详细

路由表配置

时间:2021-02-27 23:58:50      阅读:24      评论:0      收藏:0      [点我收藏+]

1、默认路径可以通过redirect来重定向

const routes = [
  { path: / , redirect: /home}, 
  { path: /home, name: home ,component: HomePage},
  { path: /list, name: list, component: ListPage},
  { path: /cart, name: cart , component: CartPage},
  { path: /mine, name: mine , component: MinePage},
  { path: /detail/:id/:name?, name: detail, component: DetailPage},
  // { path: ‘*‘, component: NotFoundPage}
];

2、可以通过*来处理404组件

 

 

3、组件切换,通过静态方式和动态方法

 

      1、静态方式 :<router-link>

    <router-link to="/home">首页</router-link> &nbsp;|&nbsp;
      <router-link :to="‘/list‘">列表</router-link> &nbsp;|&nbsp;
      <router-link :to="{path: ‘/cart‘}">购物车</router-link> &nbsp;|&nbsp;
      <router-link :to="{name: ‘mine‘}">我的</router-link>

    通过acitve-class来指定激活样式或使用默认的样式,默认类名为 .router-link-active
    通过tag属性可以修改生成标签,默认生成标签为a

·      2、动态方式: $router对象

 

路由表配置

原文:https://www.cnblogs.com/dfx9527/p/14456405.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!