vue 路由 URL传参

源码如下:
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传参的更多相关文章
- vue路由组件传参
在组件中使用 $route 会使之与其对应路由形成高度耦合,从而使组件只能在某些特定的 URL 上使用,限制了其灵活性. 使用 props 将组件和路由解耦: 取代与 $route 的耦合 const ...
- vue 路由动态传参 (多个)
动态传参 传值页面 客户列表clientList.vue 路由 router.js 配置路由 接收参数的页面 客户详情CustomerDetails.vue 通过this.$router.para ...
- Vue根据URL传参来控制全局 console.log 的开关
如果你的项目中console.log了很多信息,但是发到生产环境上又不想打印这些信息,这时候就需要设置一个全局变量,如:debug, 用正则匹配一下参数: const getQueryStr = (n ...
- Django——2 路由分配设置 re_path正则匹配 include总路由 url传参 name使用 模板渲染render方法 模板渲染方法
Django 路由分配设置 re_path正则匹配 include总路由设置 url额外参数的传递 name的使用 模板的渲染:render方法 路由的分配中, 可以设定相应的转换器加以约束,比如 ...
- Vue路由query传参
1.不要进行过深的嵌套 let id = 'uyu' this.$router.push({ path: '/mrp_detail', query: { re_order_id: id, option ...
- Vue-admin工作整理(四):路由组件传参
路由组件传参:如果在一个页面中,需要根据路由去获得参数,去对页面进行一些逻辑处理,首先可以通过this.$router来获取路由实例的参数,这样页面组件和路由就进行了耦合,为了进行分离,更大程度复用, ...
- VueJs(11)---vue-router(命名路由,命名视图,重定向别名,路由组件传参)
vue-router 上篇文章讲了第一篇vue-router相关文章,文章地址:VueJs(10)---vue-router(进阶1) 一.命名路由 有时候,通过一个名称来标识一个路由显得更方便一些, ...
- tornado 02 输出、输入和URL传参
tornado 02 输出.输入和URL传参 一.输出 write输出到页面 #write可以接受的对象 #write() 可以接受3种对象:bytes Unicode字符(二进制字符) 字典 #如果 ...
- 点击div 跳转并通过URL传参
点击div前要先给div绑定要传的参数: //给panel绑定自定义属性,方便在跳转时传带参数,键/值对排列 panel.attr("user_age",user_age); pa ...
随机推荐
- Grunt入门
Grunt 新手一日入门 2014.06.20 前端相关 TOC 1. 用途和使用场景 2. 开发一个任务自动处理器 3. 开始学习 Grunt 3.1. 安装 Grunt 3.2. 生成 packa ...
- 安装Docker 服务
curl -fsSL https://get.docker.com/ | sh 执行到这一部分出错: The program 'curl' is currently not installed. Yo ...
- Java核心-01 谈谈你对Java平台的理解
今天我要问你的问题是,谈谈你对 Java 平台的理解?“Java 是解释执行”,这句话正确吗? 典型回答 Java本身是一种面向对象的语言,最显著的特性有两个.一是所谓的“书写一次,到处运行”,能够非 ...
- Amazon DynamoDB
- 宽域POST提交数据
小数据宽域可以使用jsonp,但是大数据跨域必须post那么有以下2种方式 1,传统方式 动态生成form var url = ''var $iframe = $("<iframe s ...
- html-from提交表单
使用form创建的仅仅是一个空白的表单, 我们还需要向form中添加不同的表单项 <!DOCTYPE html> <html> <head> <meta ch ...
- day3-编码、文件、集合、函数、递归
学习内容: 1. 文件编码 2. 文件 3. 集合 4.函数 5.递归 6.匿名函数 1. 文件编码: 常见的字符串编码有:ASCII 扩展的ASCII Unicode GBK GB2312 GB18 ...
- 关于JAVA项目中CLASSPATH路径详解
写的不错:http://blog.csdn.net/cheney521/article/details/8672066 以下内容源于复制,把自己觉得不错的东西收集起来: 在dos下编译java程序,就 ...
- configparser 配置文件模块
#_author:star#date:2019/11/7# configparser 配置文件模块import configparserconfig=configparser.ConfigParser ...
- 0819NOIP模拟测试赛后总结
这次挂得很悲伤. T1.T3我都想到正解了…… 结果T1少看了个条件:20%保证ai互不相等.以为100%…… 然后挂到了20分,赛后加了个set不到1分钟就A掉了.. T2把分骗满跑路. T3sb线 ...