收藏
回答

关于页面数据渲染?

数据加载后页面渲染数据,该界面共加载三级菜单,控制台打印已全部加载,但是页面渲染加载一级菜单后就卡在这种界面不进行后续的渲染了,是性能的问题吗

这个是首页的页面渲染

  <!-- 顶部tab选项 -->
<scroll-view scroll-x="true" scroll-with-animation scroll-left="{{sliderOffset}}" class="tab" id="tab">
  <block wx:for="{{tabs}}" wx:key="item">
    <view class="tab_item {{index == activeIndex ? 'tab_item_select' : ''}} {{index == (tabs.length - 1) ? '' : 'tab_item_border'}}" data-id="{{index}}" id="{{index}}"  catchtap="tabClick">
      {{item.name}}
    </view>
  </block>
</scroll-view>
<!-- 类别与内容 -->
<view class="content">
  <scroll-view scroll-y class="content_slide" style="height: {{scrollViewHeight}}px">
    <block wx:for="{{ls11}}" wx:for-item="item" wx:key="index">
        <view class="content_slide_item {{index == select_index ? 'content_slide_item_select' : ''}}" bindtap="changepage" id="{{index}}" scroll-top="{{scollTop}}" data-index="{{index}}">
          {{tools.sub(item.title2)}}{{"\n"}}{{tools2.sub(item.title2)}}
        </view>
    </block>
  </scroll-view>
  <scroll-view scroll-y class="content_body" style="height: {{scrollViewHeight}}px">
    <block wx:for="{{ls11[select_index].foodsIndex3}}" wx:key="item">
      <view wx:if="{{showHiden == true}}" class="content_body_item" id="food{{index}}" data-id="{{item.productid}}" catchtap="goodsInfo">
        <view class="content_body_item_left"><image wx:if="{{ item.loaded }}" src="{{item.imagepath}}" mode="aspectFit"></image></view>
        <view class="content_body_item_right">
          <view class="content_body_item_right_tit">{{item.title}}</view>
          <view class="content_body_item_right_des">{{item.categoryid1name}}{{item.categoryid2name == null ? '' : item.categoryid2name}}{{item.categoryid3name == null ? '' : item.categoryid3name}}</view>
          <!-- <view class="content_body_item_right_num">已售1000</view> -->
          <view class="content_body_item_right_price">
            <view>¥{{item.retailprice}} </view>
            <!-- <text style="color:#999999;font-size:30rpx;text-decoration:line-through;font-weight:100">¥29.00</text> -->
            <image src="{{basisUrl}}Images/img/cart.svg" mode="aspectFit" catchtap="addCart" data-index="{{index}}"></image>
          </view>
        </view>
      </view>
    </block>
    <view class="tip" style="height: {{scrollViewHeight}}px" wx:if="{{showHiden == false}}">
      <image src="/img/16.png"></image>
      <text>暂无数据</text>
    </view>
  </scroll-view>
</view>
最后一次编辑于  2020-06-08
回答关注问题邀请回答
收藏

2 个回答

  • null
    null
    2020-06-08

    检查一下代码逻辑,或者接口请求有时速度慢 导致 scrollViewHeight获取不到值

    2020-06-08
    有用 2
    回复 5
    • 3987丶奋斗
      3987丶奋斗
      2020-06-08
      谢谢!是scrollViewHeight获取不到值!这个值是根据页面布局的对象实例的节点高度计算得到的,数据请求在onLoad执行调用的,这个计算scrollViewHeight高度是onReady执行的,出现我说的问题时这个方法是没有执行!请问一下这个是什么情况?
      2020-06-08
      回复
    • null
      null
      2020-06-09回复3987丶奋斗
      抱歉,回复晚了。
      这个还是请求速度慢了,然后onload页面你的数据还没有完全拿到,已经执行到了onReady ,避免这些问题可以把请求也放到onReady之中,等到返回结果再执行获取高度操作
      2020-06-09
      1
      回复
    • 3987丶奋斗
      3987丶奋斗
      2020-06-09
      谢谢!我把wx.createSelectorQuery()方法改成this.createSelectorQuery()了,然后就没出现过这个方法不执行,scrollViewHeight未0的情况了!官方文档说是页面中使用组件或是组件页面使用这个方法,但我这不是组件也没在界面中使用组件,就很奇怪!
      2020-06-09
      回复
    • null
      null
      2020-06-09回复3987丶奋斗
      获取节点在小程序里面用的场景确实不多,能不使用就不用。剩余高度问题尽量都用flex:1去解决。
      2020-06-09
      回复
    • 3987丶奋斗
      3987丶奋斗
      2020-06-09
      如果不设置固定高度的话,scroll-view组件高度会跟随内容变化,达到的效果不是经理要的效果,所以没办法。
      2020-06-09
      回复
  • 小白
    小白
    2020-06-08

    这个你本地调试一下吧,应该不是性能问题。

    2020-06-08
    有用
    回复 1
    • 3987丶奋斗
      3987丶奋斗
      2020-06-08
      这个是偶现,并不是每次都出来!在真机运行和开发者工具里运行都出现过!概率很低。
      2020-06-08
      回复
登录 后发表内容
问题标签