当前位置:   article > 正文

Uniapp URL地址栏获取指定参数_uniapp获取url参数

uniapp获取url参数

前言

  Uniapp在URL中的参数会存在于两种位置,如下:
  http://localhost:8080/unipp?id=399#/pages/index/index?name=eagle
  当我们在页面跳转时,可以通过onLoad(option)获取到#后面的传参,而前面的参数是无法获取的。

onLoad(option){
	if (option && option.name) {
		console.log('name', name)	 // name eagle
	}
	if (option && option.id) {
		console.log('id', id)	 // 控制台不会输出
	}
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

URL地址栏获取指定参数函数封装

  该方法可满足上述两个位置的参数获取,优先从#之前的部分匹配指定的参数,若没有再匹配#后面的部分。
  该方法对于参数尾部带有两个==,以及一些未知情况,可能会造成掉参现象。
  示例:getUrlValue(‘id’)    getUrlValue(‘name’)

getUrlValue(value) {
	// 从第一个?开始,且不包括#之后,并截取掉?的部分
	var query = location.search.substring(1);
	// 从#开始的部分,并转换成数组
	var hash = location.hash.split("?");
	// query和hash均没有参数
	if (!query && hash.length < 2) {
		return ''
	}
	// 先取query部分的参数进行匹配
	var vars = query.split("&")
	for (var i = 0; i < vars.length; i++) {
		var pair = vars[i].split("=")
		if (pair[0] == value) {
			return pair[1]
		}
	}
	// query没有参数,或者有参数但没找到,则取hash部分的参数
	if (!hash[1]) {
		return ''
	}
	vars = hash[1].split("&")
	for (var i = 0; i < vars.length; i++) {
		var pair = vars[i].split("=")
		if (pair[0] == value) {
			return pair[1]
		}
	}
	return ''
},
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/559676
推荐阅读
相关标签
  

闽ICP备14008679号