app.vue

<template>
<div id="app">
<router-link to="/">home</router-link>
<router-link to="/params/888/zhouyx">params</router-link>
<router-view></router-view>
</div>
</template>

router/index.js

// 引用模板
import Hello from '../components/Hello.vue'
import Params from '../components/Params.vue'
// 配置路由
export default [
{
path: '/',
name:'Hello',
component:Hello
},{
path:'/params/:newsId(\\d+)/:newsTitle',//(\\d+)正则数字
component:Params
}
]

Params.vue

<template>
<div>
<p>newsId:{{$route.params.newsId}}</p>
<p>newsTitle:{{$route.params.newsTitle}}</p>
</div>
</template>
<script type="text/javascript">
export default{
name:'Params',
data () {
return{
msg:"params page"
}
}
}
</script>

vue-router利用url传递参数的更多相关文章

  1. vue-router 利用url传递参数

    vue-router 利用url传递参数 :冒号的形式传递参数  在路由配置文件里以:冒号的形式传递参数,这就是对参数的绑定. 1. 在配置文件里以冒号的形式设置参数.我们在/src/router/i ...

  2. Vue-router 第5节 vue-router利用url传递参数

    Vue-router 第5节 vue-router利用url传递参数 目录 Vue-router 第5节 vue-router利用url传递参数 第5节 vue-router利用url传递参数 冒号的 ...

  3. Vue Router 获取url路径参数 query

    https://router.vuejs.org/zh/api/#路由对象属性 $route.query 类型: Object 一个 key/value 对象,表示 URL 查询参数.例如,对于路径  ...

  4. Vue 给子组件传递参数

    Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...

  5. Liferay中利用URL传参数

    业务场景:现在有一个新闻系统,有两个页面,A是新闻列表页面/web/guest/home,B是新闻的详情页面/web/guest/newsview. 业务逻辑为:在A页面中,点击新闻的标题进入B页面, ...

  6. 【Django】url传递参数

    1.  url传递参数的特殊字符 在压缩后,可能出现  +  -  = 空格  这类特殊字符,需要在传递前进行url编码  urllib.enquote(string) 获取参数后 urllib.un ...

  7. 8)django-示例(url传递参数)

    url传递参数有两种,一个是通过普通分组方式,一个是通过带命名分组方式 1.传递方式 1)普通分组方式,传递参数顺序是严格的.如下例子 url(r'^detail-(\d+)-(\d+).html', ...

  8. html5页面与android页面之间通过url传递参数

    html5页面与android页面之间可以通过url传递参数,android将参数放在htm5的url  ?后面,js获取url  ?号后面的参数. 方法一: <scrīpt> /* 用途 ...

  9. 用URL传递参数

    用URL传递参数,在园子里找到一篇文章解决了自己的问题,地址如下:http://www.cnblogs.com/lolicon/archive/2009/01/19/1378408.html

随机推荐

  1. 一起了解下Centos中‘vim配置’有多强大?

    在linux的系统上安装vim编辑器后,发现vim的页面设置还是不太习惯,没有显示的行号,也没有自动的缩进,页面的背景也不是很好看,但是vim编辑器是可以进行配置的,我们可以打造属于自己的vim风格. ...

  2. 小程序返回顶部top滚动

    wxjs const app = getApp(); Page({ data:{ // top标签显示(默认不显示) backTopValue:false }, // 监听滚动条坐标 onPageSc ...

  3. [Bayes] dchisq: Metropolis-Hastings Algorithm

    dchisq gives the density,                          # 计算出分布下某值处的密度值 pchisq gives the distribution fun ...

  4. [Converge] Gradient Descent - Several solvers

    solver : {‘newton-cg’, ‘lbfgs’, ‘liblinear’, ‘sag’}, default: ‘liblinear’ Algorithm to use in the op ...

  5. How to hard reset Visual Studio instance

    When developing extensions sometimes you just mess up, others someone else does. If you start gettin ...

  6. 【中间件安全】Tomcat 安全加固规范

    1. 适用情况 适用于使用Tomcat进行部署的Web网站. 2. 技能要求 熟悉Tomcat配置操作,能够利用Tomcat进行建站,并能针对站点使用Tomcat进行安全加固. 3. 前置条件 1.根 ...

  7. c++中SetEvent和ResetEvent的使用

    关于事件 事件(Event)是WIN32提供的最灵活的线程间同步方式,事件可以处于激发状态(signaled or true)或未激发状态(unsignal or false).根据状态变迁方式的不同 ...

  8. invalid bound statement (not found)解决办法

    最近搭建一个web项目后端SSM框架练手,使用Maven管理,遇到一个深坑invalid bound statement (not found),就是mapper文件扫描不到!!! 先上整合过程,解决 ...

  9. RabbitMQ随笔

    不管是官方还是能搜到的文章,使用MQ的基本思路都是这样: static void Main(string[] args) { //通过工厂建立连接 using (IConnection connect ...

  10. ThinkPHP框架 做个简单表单 添加数据例子__ACTION__ __SELF__

    public function zhuCe(){//自定义zhuCe方法和zhuCe显示表里的__ACTiON__这个相互交接 //实现两个逻辑 //1,显示注册页面 //2.向数据库添加内容 //自 ...