vue-router 利用url传递参数
vue-router 利用url传递参数
:冒号的形式传递参数
在路由配置文件里以:冒号的形式传递参数,这就是对参数的绑定。
1. 在配置文件里以冒号的形式设置参数。我们在/src/router/index.js文件里配置路由。
{
path:'/params/:newsId/:newsTitle',
component:Params
}
我们需要传递参数是新闻ID(newsId)和新闻标题(newsTitle).所以我们在路由配置文件里制定了这两个值。
2. 在src/components目录下建立我们params.vue组件,也可以说是页面。我们在页面里输出了url传递的的新闻ID和新闻标题。
<template>
<div>
<h2>{{ msg }}</h2>
<p>新闻ID:{{ $route.params.newsId}}</p>
<p>新闻标题:{{ $route.params.newsTitle}}</p>
</div>
</template> <script>
export default {
name: 'params',
data () {
return {
msg: 'params page'
}
}
}
</script>
vue-router 利用url传递参数的更多相关文章
- Vue-router 第5节 vue-router利用url传递参数
Vue-router 第5节 vue-router利用url传递参数 目录 Vue-router 第5节 vue-router利用url传递参数 第5节 vue-router利用url传递参数 冒号的 ...
- Vue Router 获取url路径参数 query
https://router.vuejs.org/zh/api/#路由对象属性 $route.query 类型: Object 一个 key/value 对象,表示 URL 查询参数.例如,对于路径 ...
- vue-router利用url传递参数
app.vue <template> <div id="app"> <router-link to="/">home< ...
- Vue 给子组件传递参数
Vue 给子组件传递参数 首先看个例子吧 原文 html <div class="container" id="app"> <div clas ...
- Liferay中利用URL传参数
业务场景:现在有一个新闻系统,有两个页面,A是新闻列表页面/web/guest/home,B是新闻的详情页面/web/guest/newsview. 业务逻辑为:在A页面中,点击新闻的标题进入B页面, ...
- 【Django】url传递参数
1. url传递参数的特殊字符 在压缩后,可能出现 + - = 空格 这类特殊字符,需要在传递前进行url编码 urllib.enquote(string) 获取参数后 urllib.un ...
- 8)django-示例(url传递参数)
url传递参数有两种,一个是通过普通分组方式,一个是通过带命名分组方式 1.传递方式 1)普通分组方式,传递参数顺序是严格的.如下例子 url(r'^detail-(\d+)-(\d+).html', ...
- html5页面与android页面之间通过url传递参数
html5页面与android页面之间可以通过url传递参数,android将参数放在htm5的url ?后面,js获取url ?号后面的参数. 方法一: <scrīpt> /* 用途 ...
- 用URL传递参数
用URL传递参数,在园子里找到一篇文章解决了自己的问题,地址如下:http://www.cnblogs.com/lolicon/archive/2009/01/19/1378408.html
随机推荐
- new 运算符的原理
关于 new 运算符的原理: 1.红宝书上解释: (1)创建一个新对象 (2)将构造函数的作用域赋给新对象 (3)执行构造函数中的代码 (4)返回新对象 2.MDN上的解释: (1)一个继承自 Foo ...
- Spring4- 04-Spring简易整合Mybatis -导入jar包/ 正常编写pojo/ 编写spring 配置文件
笔记要点&出错分析与总结 POJO(Plain Ordinary Java Object)简单的Java对象,实际就是普通JavaBeans,工程组织 (AirportService为机场 ...
- 《代码敲不队》第九次团队作业:Beta冲刺与验收准备
项目 内容 这个作业属于哪个课程 任课教师博客主页链接 这个作业的要求在哪里 作业链接地址 团队名称 代码敲不队 作业学习目标 (1)掌握软件测试基础技术(2)学习迭代式增量软件开发过程(Scrum) ...
- sizeof的注意点
sizeof('a')的值为4.因为此处‘a’是独立存在的一个字符(没有赋值给其它变量),实际上就是一个整型数,占4个字节,即此处‘a’对应的ascii码的十进制为整数97.(貌似解释得有些牵强,但事 ...
- ssh远程后台运行
ssh hadoop8 "/export/server/storm/bin/storm nimbus >/export/server/storm/nimbus_start.log 2& ...
- C# 调用 C++ Dll 类型转换的方式 全
摘要:C#引用C++ Dll 所有类型转换的方式 //C++中的DLL函数原型为 //extern "C" __declspec(dllexport ...
- BZOJ 3625:小朋友和二叉树 多项式开根+多项式求逆+生成函数
生成函数这个东西太好用了~ code: #include <bits/stdc++.h> #define ll long long #define setIO(s) freopen(s&q ...
- include和taglib指令
1.include指令用来包含另一个静态文件,这个静态文件可以是一个JSP页面.一个Servlet.文本文件.JSP代码. include.jsp <%@ page contentType=&q ...
- Servlet实现注册
1.Servlet实现注册的思路: 2.工程结构 3.功能实现: (1)html实现对数据的收集: <body bgcolor="aqua"> <center&g ...
- 学校的信息课(备战会考)LZ没带笔……
IP地址 四段十进制数组成(四个字节,32个二进制位数,一个字节八位) 用“.”隔开 每一段的取值范围[0,255] 分类:看第一个字节(见到的大多为B,C类) A:1~126 B:128~19 ...