评论

cover-view评论弹幕自动滚动到底部的做法

聊天每增加一条就自动滚动,上代码 此代码准确获取需要滚动的高度,解决苹果手机上的scroll-top过大导致溢出问题

在目前没有同层渲染的原生组件上加入文字、聊天、弹幕等就要用cover-view来解决了。
聊天每增加一条就自动滚动,上代码
此代码准确获取需要滚动的高度,解决苹果手机上的scroll-top过大导致溢出问题



{{record.nickname}}
{{record.content}}




js中处理
//发送聊天
formSubmit: function (e) {
//处理聊天内容

//设置scrollTop
this.queryMultipleNodes();

},
// 获取节点信息并设置scrollTop
queryMultipleNodes: function () {
var query = wx.createSelectorQuery(), e = this;
wx.createSelectorQuery().in(e).select(’.chat’).boundingClientRect(function (res) {
e.setData({
chatbottom: res.bottom,
})
}).exec()
query.in(e).select(’#bianjie’).boundingClientRect(function (res) {
if (res.bottom != undefined && res.bottom != ‘’ && res.bottom != null && typeof (res.bottom) != ‘undefined’) {
//var setsbottom = Math.ceil(res.bottom) ;
var setsbottom = setsbottom = Math.ceil(parseInt(res.bottom) - parseInt(e.data.chatbottom));
e.setData({ scrollTop: setsbottom });
}
}).exec()
},
初次分享,献丑了,如有不对的地方请各位大神多多指正,谢谢(-)。

最后一次编辑于  2019-03-08  
点赞 6
收藏
评论

5 个评论

  • 陈式坚
    陈式坚
    2019-03-08

    建议在代码前及后面加上 ```

    2019-03-08
    赞同 1
    回复 2
    • 福
      2019-03-08

      哈哈,可以有

      2019-03-08
      回复
    • 小昌
      小昌
      05-07回复
      scroll-top动态赋值为什么失败呀?没有实时更新
      05-07
      回复
  • Helberrrt
    Helberrrt
    03-20

    感谢感谢!!!!!!!!!!!!!

    03-20
    赞同
    回复
  • 雅兰
    雅兰
    03-10

    多谢楼主

    03-10
    赞同
    回复
  • 梦影
    梦影
    2019-05-18

    真机能实现吗

    2019-05-18
    赞同
    回复 1
    • 福
      2019-06-07

      能的

      2019-06-07
      回复
  • Daisy
    Daisy
    2019-03-26

    楼主为啥要取bottom值,而不直接取节点的高度?

    2019-03-26
    赞同
    回复 1
    • 福
      2019-05-02

      你可以试一下

      2019-05-02
      回复
登录 后发表内容