命名路由的配置规则

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

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. (转)IntelliJ IDEA 插件 阿里巴巴Java开发手册(Alibaba Java Coding Guidelines)

    背景:idea安装插件,学习使用阿里巴巴开发插件. 在线和离线的安装方式. IntelliJ IDEA 插件 阿里巴巴Java开发手册(Alibaba Java Coding Guidelines) ...

  2. 关于Oracle报 ORA-00600: 内部错误代码, 参数: [kkqcscpopn_Int: 0], [], [], [], [], [], [], [], [], [], [], []解决

    服务器上有的Oracle版本是11.2.0.1.0,但是用到了mybatis-PageHelper分页插件会报这个错误. 下面说说我是怎么遇到这个错误的:同事写的这个功能点是用到了前台分页,是正常的没 ...

  3. 服务器端debug操作

    写好的代码打个包放在服务器上,发现与理想的情况下不一致.查看log日志又觉得很烦,毕竟debug调试才是王道. 下面来说说怎么debug调试服务器上的.最好服务器上的代码和本地的保存一致,这样误差会小 ...

  4. 【windows】win10局域网共享文件夹

    1.打开 2.共享文件夹 另一台局域网电脑可根据共享的电脑ip访问就可以了[格式:\\ip] 如果右键文件夹没有共享选项

  5. spring较为常用注解

    @Configuration 从Spring3.0,@Configuration用于定义配置类,可替换xml配置文件,被注解的类内部包含有一个或多个被@Bean注解的方法,这些方法将会被Annotat ...

  6. 10步成为一个优秀的Java开发!

    1.拥有坚实的基础并理解面向对象原则 Java开发人员必须深刻理解面向对象编程.如果没有面向对象编程的坚实基础,就无法感受到像Java这样的面向对象编程语言的美感. 如果你不太了解现象对象编程是什么, ...

  7. string字符串成员函数

    string字符串成员函数 string str1="aaa"; char c='c'; str1.assign("ABCAAAAAAABBBBB");//替换 ...

  8. 【leetcode】590. N-ary Tree Postorder Traversal

    Recurisve: /* // Definition for a Node. class Node { public: int val; vector<Node*> children; ...

  9. mysql5.7新增加用户和授权

    迁移mysql数据库,运行项目的时候发现nginx和uWSGI都配置正确,可就是网站打不开,看了log文件,发现错误: django.db.utils.OperationalError: (1044, ...

  10. k8s 回滚应用

    kubectl apply 每次更新应用时 Kubernetes 都会记录下当前的配置,保存为一个 revision(版次),这样就可以回滚到某个特定 revision. 滚动更新是一次只更新一小部分 ...