幸福一生张军良 發表於 2019-11-14 14:19:00

uni-app之数据状态改动后页面不刷新踩坑

<p>今天有个需求,在onshow里面执行函数,请求过来一堆代取的包裹(快递),然后勾选之后把数据集合放到一个list里面给后端发过去,这些包裹状态就变成了已取,正常情况下应该是到了下一个界面,但是uni-app的request请求并没有实时更新,这些勾选完的快递还在,只有刷新页面才会消失,我这时候的第一想法是在勾选完之后发送list的函数之后重新调用页面加载函数,但是服务器处理数据明显需要时间,要远不及js的执行顺序来的快,但是这种重新请求数据的逻辑上是可行的,所以我利用了一个延时器,在一秒之后重新请求,这个时间足够服务器响应,也就完成了一个数据虚假实时更新,希望uni-app以后能更加完善,解决掉这个问题,还有v-for在自定义组件失效,以及诸多坑。</p>
<p>页面加载函数</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 0, 0, 1)">getWaiting() {
            </span><span style="color: rgba(0, 0, 255, 1)">var</span> that=<span style="color: rgba(0, 0, 255, 1)">this</span><span style="color: rgba(0, 0, 0, 1)">
            that.Post(
                </span>'http://192.168.3.148:8084/takeServiceOrder/findServiceOrderBySubstitute'<span style="color: rgba(0, 0, 0, 1)">,
                {
                  serviceUserId: that.userId,
                  status: </span>0<span style="color: rgba(0, 0, 0, 1)">
                },
                data </span>=&gt;<span style="color: rgba(0, 0, 0, 1)"> {
                  that.listone.length </span>= 0<span style="color: rgba(0, 0, 0, 1)">;
                  </span><span style="color: rgba(0, 0, 255, 1)">for</span> (<span style="color: rgba(0, 0, 255, 1)">var</span> i = 0; i &lt; data.length; i++<span style="color: rgba(0, 0, 0, 1)">) {
                        that.listone.push({
                            id: data.id,
                            takeDeliveryOrderId: data.takeDeliveryOrderId,
                            parcelId: data.parcelId,
                            cuId: data.cuId,
                            name: data.nickName,
                            phone: data.phone,
                            address: data.campusName </span>+ data.floorNumber + '号楼' +<span style="color: rgba(0, 0, 0, 1)"> data.doorNumber,
                            point: data.pickupAddress,
                            company: data.logisticsName,
                            number: data.pickCode,
                            checked: </span><span style="color: rgba(0, 0, 255, 1)">true</span><span style="color: rgba(0, 0, 0, 1)">
                        });
                  }
                }
            );
      },</span></pre>
</div>
<p>提交请求函数</p>
<div class="cnblogs_code">
<pre><span style="color: rgba(0, 0, 0, 1)">sendId() {
            </span><span style="color: rgba(0, 0, 255, 1)">var</span> that=<span style="color: rgba(0, 0, 255, 1)">this</span><span style="color: rgba(0, 0, 0, 1)">
            that.sendlistone.length </span>= 0<span style="color: rgba(0, 0, 0, 1)">;
            </span><span style="color: rgba(0, 0, 255, 1)">for</span> (<span style="color: rgba(0, 0, 255, 1)">var</span> i = 0; i &lt; that.listone.length; i++<span style="color: rgba(0, 0, 0, 1)">) {
                </span><span style="color: rgba(0, 0, 255, 1)">if</span> (that.listone.checked == <span style="color: rgba(0, 0, 255, 1)">true</span><span style="color: rgba(0, 0, 0, 1)">) {
                  that.sendlistone.push({
                        id: that.listone.id,
                        takeDeliveryOrderId: that.listone.takeDeliveryOrderId,
                        parcelId: that.listone.parcelId,
                        cuId: that.listone.cuId,
                        status: </span>'1'<span style="color: rgba(0, 0, 0, 1)">
                  });
                }
            }
            that.Post(
            </span>'http://192.168.3.148:8084/takeServiceOrder/update'<span style="color: rgba(0, 0, 0, 1)">,
            {
                </span>"commonIdBos"<span style="color: rgba(0, 0, 0, 1)">:that.sendlistone
            },
            (data)</span>=&gt;<span style="color: rgba(0, 0, 0, 1)">{
                console.log(data)
            }
            )
            setTimeout(()</span>=&gt;<span style="color: rgba(0, 0, 0, 1)">{
                </span><span style="color: rgba(0, 0, 255, 1)">this</span><span style="color: rgba(0, 0, 0, 1)">.getWaiting()
            }, </span>1000<span style="color: rgba(0, 0, 0, 1)">)
      },</span></pre>
</div>
<p>&nbsp;</p><br><br>
来源:https://www.cnblogs.com/hurenjie/p/11856808.html
頁: [1]
查看完整版本: uni-app之数据状态改动后页面不刷新踩坑