Loading...

记录一下小程序开发遇到的问题

日常推荐4个月前更新 Jone
103 0 0

记录下微信小程序遇到的问题

更新this.data里面的数据但界面里却没有变化

1
2
3
4
data: {
id:0 as number,
picture:[] as any
}

假设让data里的id号加一,仅仅使用

1
this.data.id+=1;

是不行的,要想页面里的数据也要变化,需要使用setdata函数。

setdata函数超过1M提示会导致性能下降

原因

每次直接把整个data数据都更新一遍

1
2
3
this.setData({
'list':this.data.list;
})

当这个list长度超过1024KB时候就会报错,而且严重拖慢小程序运行速度。

解决办法

每次只更新链表里你修改的数据

比如增加一个数据,只更新最新加的。

1
2
3
4
5
6
7
8
9
10
data: {
id:0 as number,
picture:[] as any
},
let str = "picture["+this.data.id+"]";
this.data.id+=1;
this.setData({
id:this.data.id,
[str]:res.data
})

完美解决问题。

request请求却没有返回数据

原来的代码

1
2
3
4
5
6
7
8
9
10
11
12
onLoad:async function() {
let a = getpicture(url);
}
getpicture(url:string){
wx.request({
url:url,
success:function(res){
return res;
}
})
})
}

由于微信小程序是异步的,这样请求会导致a根本没有被赋值。因为网络延迟的原因,getpicture函数还没有返回值,就已经把值赋给a了。

解决办法

用promise封装一下,等待网络请求的返回结果。

有两种方式

  1. 使用promise().then()获取返回值
  2. 使用await获取返回值

使用过程中发现第一种好像有点问题,故改成了第二种。

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
getpicture(url:string){
return new Promise<any>((resolve,reject)=>{
wx.request({
url:url,
success:function(res){
resolve(res);
},
fail:function(err){
reject(err);
}
})
})
}
onLoad:async function() {
for(let i =0;i<10;i++){
let url = 'https://app.zichen.zone/api/acg.php?json=1';
let res = await this.getpicture(url);
this.data.picture.push(res.data);
let str = "picture["+this.data.id+"]";
this.data.id+=1;
this.setData({
id:this.data.id,
[str]:res.data
})
// console.log(this.data.picture[0].imgurl);
}

小程序页面跳转传参带有”?“导致参数不全

实践过程中发现从一个界面向另一个界面传参,如果参数中带有”?“,参数”?”后面的就没了。

1
2
原来参数url:https://pan.baidu.com/s/1Y7Hz8rLCM5esxOh7EH-0qw?pwd=dghu
传过去参数url:https://pan.baidu.com/s/1Y7Hz8rLCM5esxOh7EH-0qw

解决办法

传参之前用encodeURIComponent函数编码,传过去后用decodeURIComponent函数解码即可。

© 版权声明

相关文章