源码如下:

import Vue from 'vue'
import VueRouter from 'vue-router' Vue.use(VueRouter) //全局使用该组件 const router = new VueRouter({
mode:'history',
base:__dirname,
routes:[
{
path:'/'
},
{
path:'/params/:aaa/:bbb' //绑定模板
}
]
}) new Vue({
router,
template:`
<div>
<h1>Good Morning</h1>
<ul>
<li><router-link to="/">/</router-link></li>
<li><router-link to="/params/111/222">/params/111/222</router-link></li>
</ul>
<p>show</p>
<pre>
<code>
{{$route.params.bbb}}
{{JSON.stringify($route,null,2)}}
</code>
</pre>
</div>
`
}).$mount('#app')

vue 路由 URL传参的更多相关文章

  1. vue路由组件传参

    在组件中使用 $route 会使之与其对应路由形成高度耦合,从而使组件只能在某些特定的 URL 上使用,限制了其灵活性. 使用 props 将组件和路由解耦: 取代与 $route 的耦合 const ...

  2. vue 路由动态传参 (多个)

    动态传参 传值页面  客户列表clientList.vue 路由 router.js 配置路由 接收参数的页面  客户详情CustomerDetails.vue 通过this.$router.para ...

  3. Vue根据URL传参来控制全局 console.log 的开关

    如果你的项目中console.log了很多信息,但是发到生产环境上又不想打印这些信息,这时候就需要设置一个全局变量,如:debug, 用正则匹配一下参数: const getQueryStr = (n ...

  4. Django——2 路由分配设置 re_path正则匹配 include总路由 url传参 name使用 模板渲染render方法 模板渲染方法

    Django 路由分配设置 re_path正则匹配 include总路由设置 url额外参数的传递 name的使用 模板的渲染:render方法   路由的分配中, 可以设定相应的转换器加以约束,比如 ...

  5. Vue路由query传参

    1.不要进行过深的嵌套 let id = 'uyu' this.$router.push({ path: '/mrp_detail', query: { re_order_id: id, option ...

  6. Vue-admin工作整理(四):路由组件传参

    路由组件传参:如果在一个页面中,需要根据路由去获得参数,去对页面进行一些逻辑处理,首先可以通过this.$router来获取路由实例的参数,这样页面组件和路由就进行了耦合,为了进行分离,更大程度复用, ...

  7. VueJs(11)---vue-router(命名路由,命名视图,重定向别名,路由组件传参)

    vue-router 上篇文章讲了第一篇vue-router相关文章,文章地址:VueJs(10)---vue-router(进阶1) 一.命名路由 有时候,通过一个名称来标识一个路由显得更方便一些, ...

  8. tornado 02 输出、输入和URL传参

    tornado 02 输出.输入和URL传参 一.输出 write输出到页面 #write可以接受的对象 #write() 可以接受3种对象:bytes Unicode字符(二进制字符) 字典 #如果 ...

  9. 点击div 跳转并通过URL传参

    点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...

随机推荐

  1. memcpy函数实现中的优化

    今天浏览Google面试题的时候,有看到一个memcpy的实现,以及如何去优化memcpy. 我对memcpy的实现的记忆就是,拷贝的时候需要从后往前拷贝,为何防止内存重叠. 但是如果去优化它我没有想 ...

  2. 记录一次idea因为修改子模块名称而引申的一大堆问题(未完全解决)

    文章目录 背景 看图说话 解决 因为这个案例引申出来的错误 修改了之后莫名出现在java 和resource文件后面出现sources root字样 修改了之后java和resource后面出现了[c ...

  3. Linux后台运行java的jar包后台运行java -jar 命令

    为什么java -jar 的命令终端的窗口关闭就停止运行了??tomcat中war的就不会? 关闭终端的窗口相当于ctrl+c的命令,关闭了窗口就相当于停止了java -jar这个进程,即ctrl+c ...

  4. 数据库连接JDBC

    #=======================mysql============================= #jdbc.driverClassName=com.mysql.jdbc.Driv ...

  5. VS2017+QT5.12环境配置与动态链接库的生成

    最近需要重新编译一个DLL动态链接库,由于源码中包含了QT代码,所以现在需要配置VS+QT环境. 本人系统环境:Win10 64位 一.安装 Visual Studio 2017软件下载安装教程:ht ...

  6. Linux 下 Nand Flash 调用关系

    Nand Flash 设备添加时数据结构包含关系 struct mtd_partition        partition_info[] --> struct s3c2410_nand_set ...

  7. Python全栈开发:web框架之tornado

    概述 Tornado 是 FriendFeed 使用的可扩展的非阻塞式 web 服务器及其相关工具的开源版本.这个 Web 框架看起来有些像web.py 或者 Google 的 webapp,不过为了 ...

  8. git sync tags with remote

    git 同步遠程標籤 在 .git/config的 [remote "origin"] 下加了 fetch = +refs/tags/*:refs/tags/* 最後就變成 [re ...

  9. [symonfy] An error occurred when executing the "'cache:clear --no-warmup'"

    Symfony Version: 3.4.* 当运行 composer update 会出现 [RuntimeException] An error occurred when executing t ...

  10. 如何玩转跨库Join?跨数据库实例查询应用实践

    背景 随着业务复杂程度的提高.数据规模的增长,越来越多的公司选择对其在线业务数据库进行垂直或水平拆分,甚至选择不同的数据库类型以满足其业务需求.原本在同一数据库实例里就能实现的SQL查询,现在需要跨多 ...