指向性问题+navigateTo传对象类型的参数

是搞前端的萌新希望

于 2024-07-12 11:58:44 发布

阅读量204

点赞数 3

文章标签：前端

本文链接：https://blog.csdn.net/qq_63730264/article/details/140355665

版权

今天在编写代码时，遇到了this指向性问题，常见的情况是，在使用uni的一些API时，当API的参数是OBJECT时并且在它的success中，
例如：打开扫一扫uni.scanCode（）

var that = this;
uni.scanCode({
	onlyFromCamera: true,
	async success(res) {
		//当在这里面使用this时，这里的this跟外面的this并不是同一个this，常见的场景是当我们打开扫一扫后获取到数据之后需要去发起请求调用接口，这时就需要用到面对指向性问题
		const res1 = await uni.request({
			url: that.baseUrl + '/search',
			method: "POST",
			data: {
				//此时的that就是在外部切换指向性后的this
				"bid_no": that.formData.codeId
			},
			header: {
				"content-type": "application/x-www-form-urlencoded"
			}
		})
	}
})

今天的第二个问题，在使用uni.navigateTo进行一些单页面跳转时，比如跳入一个详情页，有一种方法是在获取到数据之后，存入全局状态管理中（vuex，pinia等），但是当这个数据并不需要在其他页面中使用时，这种方法就略显笨拙，因此只有通过uni.navigateTo自带的传参，然而这个问题又涉及到，它只允许url拼串传参，但是我需要传输的数据是一个对象数据，这就行不通，那就只能通过字符串转换的形式，首先将它转换为json格式，如何再到另一个页面的时候将它进行解码

//发送端
const data = {
	name: "Tom",
	age: "18"
}
// 将对象转换为JSON字符串  
let jsonStr = JSON.stringify(data)
// 对JSON字符串进行编码，以便它可以安全地放在URL中  
let encodedJsonStr = encodeURIComponent(jsonStr);  
uni.navigateTo({
	url: `pages/home/home?data=${encodedJsonStr}`
})

//接收端
onLoad(options) {
	//获取数据
	let encodedJsonStr = options.data;
	//解码
	let jsonStr = decodeURIComponent(encodedJsonStr);
	// 将JSON字符串转换回对象  
	let obj = JSON.parse(jsonStr);
}