-
2020-04-06 16:10:43
利用 url 传递参数
官方推荐是使用
name
属性来传递参数。url 地址也可以用来传递参数,这是常识,在前端编程中,也经常使用,以下是 Vue.js 如何使用
url
来进行参数的传递。使用
url
传递,自然需要在 url 上进行更改,首先将 App.vue 中的<router-link>
标签中的to
属性进行修改。<template> <div id="app"> <img alt="Vue logo" src="./assets/logo.png"> <p> <router-link to="/">Home</router-link> <router-link to="/params/198/qian">params</router-link> </p> <router-view></router-view> </div> </template> <script> export default { name: 'App', } </script> <style> #app { font-family: Avenir, Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } .right { float: left; width: 50%; height: 300px; background-color: #ccc; } .left { float: left; width: 50%; height: 300px; background-color: #c0c; } </style>
第二个
<router-link>
的to
属性的属性值代表的意思为:params 路径下的 id 为 198 ,标题为 qian 的一篇文章。为了实现输入以上 url 地址可以正确跳转到对应的组件上,我们需要对 router 文件进行修改:import Vue from 'vue'; import Router from 'vue-router'; import Hello from '@/components/HelloWorld' import Params from '@/components/Params'; Vue.use(Router); export default new Router({ routes: [ { path: '/', name: 'Hello', component: Hello, }, { path: '/params/:newsId(\\d+)/:newsTitle', component: Params, } ] })
newId(\\d+)
中的(\\d+)
是正则表达式,意味只能接受数字。既然 url 可以传递参数,那么应该可以在对应的组件中接受参数,所以,接下来是在 Params 组件中,接受来自 url 中的参数:
<template> <div> <h3> {{msg}} </h3> <p>newsId: {{ $route.params.newsId }}</p> <p>newTitle: {{ $route.params.newsTitle }}</p> </div> </template> <script> export default { name: 'Params', data() { return { msg: `Params pages`, } } } </script>
这里,可以接受来自 url 的参数。
以下是结果:
更多相关内容 -
php url传递参数的两种方式
2021-03-23 12:04:09phpurl传递参数的两种方式(2011-08-13 20:42:13)$url = $_SERVER["REQUEST_URI"];$url_page = parse_url($url);$url = $_SERVER["REQUEST_URI"];$url_page = parse_url($url);php 传参数,有两种方式GET 和POST,1. ...php url传递参数的两种方式
(2011-08-13 20:42:13)
$url = $_SERVER["REQUEST_URI"];
$url_page = parse_url($url);$url = $_SERVER["REQUEST_URI"];
$url_page = parse_url($url);php 传参数,有两种方式GET 和POST,
1. url里面的参数传递,php get参数方法
举例一下,index.php?do=fly
$_GET[’do’] 这样就能取到fly这个值了
2. url里面的参数传递,php post参数方法
$ua=parse_url("http://username:password@hostname/path?arg=value#anchor");
print_r($ua);
结果:
Array
(
[scheme] => http
[host] => hostname
[user] => username
[pass] => password
[path] => /path
[query] => arg=value
[fragment] => anchor
)
如果定位某一个页面为index?1的话,则
$url = $_SERVER["REQUEST_URI"];
$url_page = parse_url($url);
此时$url[query]的值就为1,实现了参数传递
分享:
喜欢
0
赠金笔
加载中,请稍候......
评论加载中,请稍候...
发评论
登录名: 密码: 找回密码 注册记住登录状态
昵 称:
评论并转载此博文
发评论
以上网友发言只代表其个人观点,不代表新浪网的观点或立场。
-
使用URL传递参数
2020-02-11 22:03:46现在比较流行RESTful风格,而通过URL进行参数的传递这就符合RESTful风格。 什么是RESTful风格呢? 对应的中文是rest式的;Restful web service是一种常见的rest的应用,是遵守了rest风格的web服务;rest式的web...现在比较流行RESTful风格,而通过URL进行参数的传递这就符合RESTful风格。
-
什么是RESTful风格呢?
对应的中文是rest式的;Restful web service是一种常见的rest的应用,是遵守了rest风格的web服务;rest式的web服务是一种ROA(The Resource-Oriented Architecture)(面向资源的架构). -
什么是REST呢?
REST就是一种设计API的模式。 -
springMVC对于RESTful的支持:
(1) 利用@RequestMapping 指定要处理请求的URI模板和HTTP请求的动作类型
(2)利用@PathVariable讲URI请求模板中的变量映射到处理方法参数上
(3)利用Ajax,在客户端发出PUT、DELETE动作的请求以上关于RESTful的介绍来源于:什么是REST以及 RESTful?
一,使用URL传递参数
使用URL进行参数的传递需要注解
@RequestMapping
和@PathVariable
。这里的URL将写作(/ParamsController/getStudentName/Tom
)。1.1 代码部分
1.1.1 Controller
@Controller @RequestMapping("/ParamsController") public class ParamsController { @Autowired private StudentService studentService; @RequestMapping(value = "/getStudentName/{studentName}") public ModelAndView URLPathVariable(@PathVariable String studentName){ Student student = studentService.selectStudent(studentName); ModelAndView mv = new ModelAndView(); mv.addObject("Student", student); mv.setViewName("StudentInfo"); return mv; }
1.1.2效果展示
二,这是一个只支持GET请求的方法
当我们把请求方法改为POST时
就出现了这样的问题:Request method 'GET' not supported
因此,通过URL传递参数是一种只支持GET的方法,同时了,@RequestMapping
的如果不限定RequestMethod
的值,以下都可以访问RequestMethod.GET RequestMethod.POST RequestMethod.PUT RequestMethod.DELETE
三、AJAX默认是异步的
原本自己想的是前端输入一个姓名,点击查询,就可以进行跳转到对应的信息页面。
js代码如下:<h1>-------------------------------URL参数传递-------------------------------------------</h1> <form id="studentNameForm"> <h2>查询学生的姓名:<input id="studentName" name="studentName" value=""/> <input id="btn1" type="submit" value="查询"/></h2> </form> <script> $(function () { $("#btn1").click( function () { $.ajax({ url:"/ParamsController/getStudentName/"+$("#studentName").val(), type:"POST", success:function () { // window.location.href="*****";没有 } }); }); console.log(url); }); </script>
但是后台成功的接收到了前端传来的数据,但是却没有进行页面的跳转。
如图:
后端页面获取到了前端传来的值,但是却没有进行跳转。
其实这是因为忽略了AJAX是异步的。ajax实际上是通过XMLHttpRequest来向服务器发送异步请求的,从服务器获取数据,然后使用JS来更新页面,这也就是常说的局部刷新实现方式,所以ajax请求之后,服务器返回的都是纯文本流,客户端的浏览器在获取ajax异步结果时,不是直接显示在页面上,而是要通过js来进行处理,js处理完以后才能显示在页面上,所以这才导致了controller中的ModelAndView对象不能直接返回视图。
网上有一种解决方法是:
这里的解决方案,应该是:
ajax传输数据成功后,返回数据,然后使用window.location.href="对应的controller页面"+"data返回的数据";
这样的形式进行跳转。
-
-
通过URL传递参数给python(加减法)
2020-12-08 12:36:59通过URL传递参数给python(加减法)(2009-06-16 09:47:35)标签:杂谈重点:1.urls的设置:urls=('','index')2.格式转换由于从url上得到的输入都是字符串形式的不能直接相加减所以必须转换利用python的string模块import ...通过URL传递参数给python(加减法)
(2009-06-16 09:47:35)
标签:
杂谈
重点:
1.urls的设置:
urls=('','index'
)
2.格式转换
由于从url上得到的输入都是字符串形式的不能直接相加减所以必须转换
利用python的string模块
import string;
num=string.atoi("")
3.如何显示
必须用web.header()方法,告诉python用什么格式显示
例:web.header('Content-type', 'text/html')
例子:
import string
import web
from Cheetah.Template import Template
urls = (
'', 'index'
)
class index:
def GET(self):
Get=web.input()
value1=Get.a;value2=Get.b
num=string.atoi(value1);num1=string.atoi(value2)
value3=num+num1
x={};
x['value']=value3
web.header('Content-type', 'text/html')
template=Template(file='E:/xx.html',searchList=[x])
print template,
application = web.wsgifunc(web.webpyfunc(urls, globals()))
web.webapi.internalerror = web.debugerror
if __name__ == "__main__": web.run(urls, globals())
E:\xx.html:
分享:
喜欢
0
赠金笔
加载中,请稍候......
评论加载中,请稍候...
发评论
登录名: 密码: 找回密码 注册记住登录状态
昵 称:
评论并转载此博文
发评论
以上网友发言只代表其个人观点,不代表新浪网的观点或立场。
-
Vue中通过URL传递参数
2019-07-04 17:39:07进行页面跳转和参数传递之外,还可以使用URL链接进行参数传递,这些参数携带在链接地址后面,比如:/Users/xiaofeiniao/Desktop/Vue/URLParam.html#/home/10001/oo/www.baidu.com, 中间10001 ,oo,ww... -
vue使用url传递参数
2020-07-30 19:37:23传值 this.$router.push({ path:’/userInfo’,query{id:‘123456’,name:‘ceshi’}}) 取值: this.id=this.$router.query.id this.name =this.$router.query.name -
uniapp url 传递参数 、接收参数
2020-07-22 10:50:00uniapp url 传递参数 、接收参数 uniapp url 地址 接收参数 uniapp url 传递参数 uniapp 接收 url 参数 -
Vue:通过url传递参数
2020-04-21 10:58:05通过地址栏传递参数,首先在index.js中创建好url模板 import Vue from 'vue' import Router from 'vue-router' import HelloWorld from "../components/HelloWorld"; import Hi1 from "../components/Hi1"; import Hi... -
Flask之URL传递参数的两种方式
2020-01-07 17:10:20两种方式传递参数 第一种: /路径/参数,(就是将参数嵌入到路径中)。 如: http://127.0.0.1:5000/user/123 第二种: /路径?参数名1=参数值1&参数名2=参数值2… 如: http://127.0.0.1:5000/test/?wd=python&... -
Django URL传递参数的方法总结
2018-12-20 19:19:001 无参数情况 配置URL及其视图如下: (r'^hello/$', hello) def hello(request): return HttpResponse("Hello World") 访问...2 传递一个参数 配置URL及其视图如下,URL中通... -
django中通过url传递参数的例子
2019-05-31 20:02:58需求:通过url传递参数,删除表中的某个记录。 urls中: views中,使用反射,根据传递的参数(tablename,id)获取表格的记录: 补充: # http://127.0.0.1:8000/ 直接访问home函数 ... -
html通过url传递参数
2018-01-10 14:36:53html通过url传参,另一个页面读取 比如 login.html 页面跳转到index.html页面,把登陆用户名传过去 href="index.html?username="123" index.html获取传来的username,通过getQueryString方法 function get... -
6-5.Vue-router之利用URL传递参数
2020-02-06 15:27:54Vue中利用url传递参数 在进行路由页面跳转时如果遇到需要传递参数的情况,可以通过配置src/router/index.js路由文件实现跳转路由时传递参数的功能。 在实际的开发中,当我们实现新闻的浏览功能时需要根据每个新闻... -
Django URL传递参数方式总结
2018-06-23 23:03:34Django URL传递参数方式总结 (django2.0)新建一个Django项目,默认的urls.py文件内容。from django.contrib import admin from django.urls import path,include urlpatterns = [ path('admin/', admin.site.... -
vue通过URL传递参数
2018-04-23 19:53:43比如说我们传递两个值newId和newTitle(配置文件里以:冒号的形式传递参数,这就是对参数的绑定). 2**传递参数的值**:在APP.vue中设置——此时newId的值为12/newTitle的值如图3.获取参数值:首先我们得在components... -
Django学习系列之三:URL传递参数
2018-10-14 13:36:30Django学习系列之三:URL传递参数 (一)在URL中使用变量的方式 如:view.py #说明已经创建了名为book的APP From django.http import HttpResponse def book (request): return HttpResponse('图书首页') ... -
Flask 通过URL传递参数,动态URL含有'/'斜杠问题
2019-01-15 11:32:27其中&lt;id&gt;,尖括号是固定写法,语法为,variable默认的数据类型是字符串。如果需要指定类型, 则要写成&...,其中converter就是类型名称,可以有以下几...path: 和string类似,但是可以传递... -
vue-router 利用url传递参数
2018-07-27 14:21:55一 : 冒号的形式传递参数 我们可以在理由配置文件里以:冒号的形式传递参数,这就是对参数的绑定。 1.配置路由 在配置文件里以冒号的形式设置参数。我们在/src/router/index.js文件里配置路由。 ... -
url传递参数标准形式
2016-05-03 13:17:05manage_messages_path GET /manage/messages(.:format) manage/messages#index ...#####通过manage_messages_path来传递guest_id和host_id, target实际是html的一个属性, target的参数用法如下: -
Django笔记 通过URL传递参数的4种方法 + 补充
2016-10-29 09:54:19【转自ian的个人博客】 感谢ian的总结!1 无参数情况 配置URL及其视图如下: (r’^hello/$’, hello) ...访问http://127.0.0.1:8000/hello,输出结果为“Hello World”2 传递一个参数 配置URL及其视图如下,U -
微信小程序 页面跳转如何通过url传递参数
2018-06-11 10:26:11var fb_id = 132在跳转地址后wx.naviga在跳转地址后teTo({ url: `../free/sellers/sellers?fb_id=${fb_id}`, })然后在新页面通过js获取数据 onLoad: function (options) { console.log(options.fb_id) var fb_id = ... -
http请求 url传递参数
2019-12-08 17:08:041、参数带有斜杠 方法1:修改一下启动类,加一个系统参数,重写WebMvcConfigurerAdapter的configurePathMatch方法 @SpringBootApplication public class Application extends WebMvcConfigurerAdapter { public... -
Spring MVC使用URL传递参数
2018-08-02 11:20:32创建控制器 ... import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.PathVariable; import org.springframework.web.bind.annotation.RequestMap... -
微信小程序-navigator 跳转url传递参数
2017-07-07 20:05:43使用方法说明 ...(1)传值:在navigator的属性url后拼接?id(参数名字)=要传递的值 (如果多个参数用&分开 &name=value&…….) (2)取值:options 是包含url地址中参数的对象,可以直接 点 获取。 -
请问如何不通过url传递参数
2015-06-18 11:35:33``` $('#dd').dialog({ title: 'My Dialog', data : { bt:555, id : 111 },//这样不行啊 dataType : "json", width: 400, height: 200, ...请问如何不通过url传递参数 -
微信公众号中url传递参数到第三方的网页
2017-07-01 18:06:36在微信公众号开发中,有这么一个场景,点击模板消息中详情url进入到第三方的界面的问题,不知道别的大神是怎么做的,我第一种方法是,老老实实的按照官方文档去做。方法1:通过网页授权,获取到code,再通过code获取... -
url 传递参数(特殊字符)解决方法
2016-06-30 00:47:06有些符号在URL中是不能直接传递的,如果要在URL中传递这些特殊符号,那么就要使用他们的编码了。下表中列出了一些URL特殊符号及编码 十六进制值 1. + URL 中+号表示空格 %2B 2. ... -
url中传递参数
2018-09-14 09:40:131.url传递参数 1.非关键字参数 url地址访问格式:/路径/路径/参数 urls正则的定义:/路径/路径/(参数匹配的正则) 注意:1.如果要获取传递进来的参数,必须给对应的正则加上()才可以提取 2.如果url中有...