PHP、JS和vue基本的url带参传参

PHP的比较简单

//url直接输入
https://xulgr.com/?参值1=参数1&参值2=参数2&参值3=参数3

//输出
参数1：<?php echo($_REQUEST['参值1']);?>
参数2：<?php echo($_REQUEST['参值2']);?>
参数3：<?php echo($_REQUEST['参值3']);?>

 

JS的比较繁琐一些

function xgurlparam(variable){
	var query = window.location.search.substring(1); //查询字选集串?的第一段
	var vars = query.split("&"); //分隔符&
	for (var i=0;i<vars.length;i++) {
		var pair = vars[i].split("="); //分隔符=
		if(pair[0] == variable){return pair[1];}
	}
	//截取url中?后面$xxxx=字段
	return(false);
}


// 举例链接：https://xulgr.com/?name=雪哥&url=xulgr.com&qq=2037555766
var name = xgurlparam("name"); //输出：雪哥
var url = xgurlparam("url"); //输出：xulgr.com
var qq = xgurlparam("qq"); //输出：2037555766

//JS直接输出结果显示在页面上
document.write(name);

 

uniapp项目的也比较简单：

例如一个video.vue页面，只要参数加入到路径即可：/page/video/video?url=视频链接&name=视频标题&jianjie=视频简介

<template>
	<view>
		{{jianjie}}
	</view>
	<view>
		<video :src="xgaurl" :title="xgname"></video>
	</view>
</template>
<script>
export default {
	data() {
		return {
			xgurl: '',
			xgname: '',
			xgqq: ''
		}
	},
	onLoad(val) {
		this.xgurl = decodeURIComponent(val.url); //输出url参数
		this.xgname = decodeURIComponent(val.name); //输出name参数
		this.jianjie= decodeURIComponent(val.jianjie); //输出jianjie参数
	},
	methods: {
		
	}
}
</script>

<style>
</style>

 

JS Location 属性说明

//获取 # 号后面的字符串
window.location.hash
//输出结果示例
#/lingshoustatis/?starttime=2018-11-21&&endtime=2018-11-21

//获取 url 协议部分
window.location.protocol
//输出结果示例
http:

//获取 href  属性中 ‘?’后的部分，又称为查询字选集串
window.location.search
//输出结果示例
"?name=kang&when=2011"

//获取端口号
window.location.port
//输出结果示例
8000

//获取整个 url 字符串
window.location.href
//输出结果示例
http://localhost:8000/bui/#/lingshoustatis/?starttime=2018-11-21&&endtime=2018-11-21

//获取对象指定文件名或者路径
window.location.pathname
//输出结果示例
/bui/

//获取 location 或 URL 的 hostname 和 port 号码
window.location.host
//输出结果示例
localhost:8000