vue-router 的重定向-redirect

1. 我们主要在index.js重新设置路由的重新定向redirect参数

index.js

import Vue from 'vue'
import Router from 'vue-router'
import HelloWorld from '@/components/HelloWorld'
import Params from '@/components/Params'
Vue.use(Router) export default new Router({routes: [             {                    path: '/',        name: 'HelloWorld',     component:HelloWorld   },{path:'/params/:Id/:Title',component:Params},{path:'/goHome',redirect:'/'},{path:'/goparams/:Id/:Title',redirect:'/params/:Id/:Title'   //这里对应的是重定向的path   path:'/params/:Id/:Title',

} ] })

　　2.在App.vue 设置vue-router

<router-link to="/">首页</router-link>

<router-link to="/params/2018-6-18/世界杯">params</router-link> |

<router-link to="/goHome">go 首页</router-link>

<router-link to="/goparams/2018-6-19/我们">GOparams</router-link>

　　效果：

转载于:https://www.cnblogs.com/guangzhou11/p/9196135.html

vue-router 的重定向-redirect相关推荐

vue中路由重定向redirect
1.重定向的地址不需要接收参数 const routes = [{ path: '/', redirect: '/index'},{ path: '/index', component: index ...
vue router 常用操作重定向 redirect
1.重定向 redirect const routes = [{ path: '/', redirect: '/index'},{ path: '/index', component: index } ...
Vue router 重定向 redirect 如何传值
配置 vue_router 时, 很经常就用到重定向(redirect)功能例如: 没登录重定向到登录页面(导航卫士拦截也是高效的登录检查方法) index, home, house 重定向到首页等 ...
Vue Router路由及路由重定向
Vue的核心深度集成,可以非常方便的用于SPA应用程序的开发. 实现路由功能七大步骤第一步:引入相关的库文件注意:必须先引用Vue,在引用vue-router 顺序不能颠倒 <!-- 导入 ...
React Router 升级 v6: Redirect 重定向替代方案
React Router 升级 v6: Redirect 重定向替代方案文章目录 React Router 升级 v6: Redirect 重定向替代方案 React Router v6 Redir ...
Vue Router的详细教程
Vue Router的详细教程安装 #直接下载 / CDN https://unpkg.com/vue-router/dist/vue-router.js Unpkg.com 提供了基于 NPM 的 ...
vue router 路由鉴权（非动态路由）
概述角色:超级管理员.主题管理员.数据服务管理员权限: 超级管理员:所有页面主题管理员:基础公共页面+主题设置页数据服务管理员:基础公共页面+数据服务设置页+数据服务审批页需求:角色菜单来自 ...
vue router name命名规范_vue-router使用
vue-router基本用法 vue-router的实现原理: 路由不同的页面也就是加载不同的组件. 路由的三个基本概念: router:它是一条路由,test按钮 => test内容,这是一条 ...
【Vue.js】Vue.js中常用的UI组件库和Vue Router
1.Vue生态中常用的UI组件库 1. vant 介绍轻量级.可靠的移动端 Vue 组件库有赞前端团队出品 GitHub地址:https://github.com/youzan/vant 特性拥 ...
Vue Router 实现路由控制实战
本文是我在学习过程中记录学习的点点滴滴,目的是为了学完之后巩固一下顺便也和大家分享一下,日后忘记了也可以方便快速的复习. Vue Router 实现路由控制实战前言一.什么是单页面应用及实现前端路 ...

vue-router 的重定向-redirect

vue-router 的重定向-redirect相关推荐

最新文章

热门文章