image.png
今天遇到了个奇怪的bug，
小程序搜索模块，当从主tab切换到医生tab时，发现这个“李海兵”的医生卡片居然渲染了两次，于是开始定位，到底是哪个环节出错了，考虑到搜索的数据处理逻辑比较复杂，总以为是用来维护搜索store的类，更新数据的方法被调用了2次。
后来发现并没有，还是一个细心的同事帮忙找到了原因，
image.png
原来是这个hooks多次执行了，导致请求列表的接口被调用了两次，
image.png
解决方法
image.png
原因就是useEffect的依赖参数filter是个引用类型
还有2种可解决的方法，参照下方链接
总结：排查问题的思路有问题，重复渲染首先要排查的就是是否重复发起请求。
今天遇到了个奇怪的bug，小程序搜索模块，当从主tab切换到医生tab时，发现这个“李海兵”的医生卡片居然渲染了两...
在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。默认数组的当前项的下标变...
所谓的列表渲染，就是对于列表数据的展示。其使用场景大多为商品列表页面、购物车页面、收藏列表等页面，应用广泛。微信小...
9、列表渲染wx:for 小程序提供了一个wxml组件的for循环，称为列表渲染 9.1.1 将3篇文章的数据提取...
Taro小程序dva框架开发学习 本篇介绍的是Taro小程序开发，仅供学习参考。使用的框架是Taro(3.3.9)...
学习目标 小程序生命周期 wxml数据渲染，列表渲染， 条件渲染 组件事件绑定 (bindtap, bindinp...
1. 指令渲染指令：vx:for每个项目在微信小程序中定好了，都叫item。 2. 微信小程序的列表渲染可以渲染数...
用Taro做个微信小程序Todo, 小白工作记录 微信小程序框架: Taro 做微信小程序的框架, 几个比较主流的...
环境 taro 2.2.3 window 微信小程序 使用getApp()方法 在taro中，使用Taro.get...
swiper组件即滑块视图容器，通常用来做轮播图。样子如下： 从官方的代码（这里我就不贴了，大家可以去查阅官方文档...
本文标题：taro小程序同一个列表渲染了2份
本文链接：https://www.haomeiwen.com/subject/csvstrtx.html
网友评论