命名路由的配置规则

为了更加方便的表示路由的路径,可以给路由规则起一个别名, 即为“命名路由”。

const router = new VueRouter ({
routes: [
{
path: '/user/ :id',
name: 'user',
component: User
}
]
})
<router-link :to="{ name: 'user', params: { id: 123 }}">User</router-link>
router.push({ name: 'user', params: { id: 123 })

10. vue-router命名路由的更多相关文章

  1. Vue router 一个路由对应多个视图

    使用命名路由 https://jsfiddle.net/posva/6du90epg/ <script src="https://unpkg.com/vue/dist/vue.js&q ...

  2. Vue 中的Vue Router一级路由,二级路由,三级路由以及跳转

    今天编写了一下Vue中的路由 先用命令行新建一个空的项目,并且我知道要用路由,就下载了路由的相关依赖 vue init webpack demo5 完毕之后进入所在的项目 cd demo5 之后用vs ...

  3. 10.vue router 带参数跳转

    vue router 带参数跳转 发送:this.$router.push({path:'/news',query:{id:row.id}}) 接收:var id=this.$route.query. ...

  4. vue router引入路由与路由配置容易犯错的地方与常见的报错与处理报错

    首先npm安装vue-router插件,就不说了其次: 先看下我本地的目录结构吧 第一步:在src目录下新建一个专门存放router的index.js文件里面的内容为: import Vue from ...

  5. Vue router 全局路由守卫

    记录一下全局路由守卫的使用: 方法一:定义一个数组用于检测与管理需要登录的页面,全局路由守卫配合本地存储判断是否跳转 import Vue from 'vue' import Router from ...

  6. vue router动态路由

    <div id="#app"> <router-link to="/user/header">路由1</router-link&g ...

  7. [Vue 牛刀小试]:第十三章 - Vue Router 基础使用再探(命名路由、命名视图、路由传参)

    一.前言 在上一章的学习中,我们简单介绍了前端路由的概念,以及如何在 Vue 中通过使用 Vue Router 来实现我们的前端路由.但是在实际使用中,我们经常会遇到路由传参.或者一个页面是由多个组件 ...

  8. Vue.js之路由系统

    Vue.js生态之vue-router vue-router是什么? vue-router是Vue的路由系统,定位资源的,我们可以不进行整页刷新去切换页面内容. vue-router的安装与基本配置 ...

  9. Vue 路由的简单使用(命名路由、query路由传参、params路由传参)

    1 # Vue 路由 2 # 1.理解:一个路由(toute)就是一组映射关系(key-value),多个路由需要路由器(router)进行管理 3 # 2.前端路由:key是路径,value是组件 ...

  10. Vue.js 2.x笔记:路由Vue Router(6)

    1. Vue Router简介与安装 1.1 Vue Router简介 Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,构建单页面应用. Vue Rout ...

随机推荐

  1. python入门之格式化输出

    目录 扩展: 保留几位小数 一.占位符格式化输出 1.1 %s 1.2 %d 二..format()方式 三.f-string 扩展: 保留几位小数 保留两位小数 a = 12345.2487 pri ...

  2. [转]matlab GUI 新手入门——最基本的几个概念

    本文摘自iLoveMatlab论坛 1.从最简单的开始 编程的基本思想是:我执行一个操作,程序做出一个反应."一个操作"包括点击鼠标.拖动滑块.填写数据.选择选项等:"做 ...

  3. swift版 二分查找 (折半查找)

    二分查找作为一种常见的查找方法,将原本是线性时间提升到了对数时间范围之内,大大缩短了搜索时间,但它有一个前提,就是必须在有序数据中进行查找.废话少说,直接上代码,可复制粘贴直接出结果! import ...

  4. cas sso 单点登录

    一些介绍: https://www.jianshu.com/p/b7de8e4cf217 https://blog.csdn.net/javaloveiphone/article/details/52 ...

  5. 使用 EnumWindows 找到满足你要求的窗口

    原文:使用 EnumWindows 找到满足你要求的窗口 在 Windows 应用开发中,如果需要操作其他的窗口,那么可以使用 EnumWindows 这个 API 来枚举这些窗口. 本文介绍使用 E ...

  6. Linux RedHat7.0_64位系统中安装Oracle_11g_R2

    步骤一: 当然是安装rhel7操作系统啦(废话),建议在安装过程中系统软件类型选择最后一项[Server with GUI].其他的默认一般即可. 步骤二:在初装完成的系统中无法像Windows那样直 ...

  7. 解决打开IE报错“无法启动...丢失api-ms-win-core-path-l1-1-0.dll”的问题

    打开IE突然发现报错 试了各种方法都不行 最终看这篇文章,才解决:https://www.yijile.com/log/577.html 打开IE设置选项,选择管理加载项,如图讲该选项禁用,就不报错. ...

  8. C# vb .net实现透视阴影特效滤镜

    在.net中,如何简单快捷地实现Photoshop滤镜组中的透视阴影特效效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 ...

  9. 2.在HTML中使用JavaScript

    目录 1. script元素 2. 标签的位置 3.延迟和异步加载 4.嵌入代码与外部代码的区别 5.noscript元素 6. 小结 1. script元素 向HTML中插入JavaScript的主 ...

  10. 140款Android开源优秀项目源码

    BeautifulRefreshLayout-漂亮的美食下拉刷新 https://github.com/android-cjj/BeautifulRefreshLayout/tree/Beautifu ...