uniapp 开发app时,需要用到评论功能,当我们评论是,需要评论内容滚动到最新的地方,比如滚动到最底部。
<scroll-view id="scrollview" class="list" :scroll-top="scrollTop" :class="{list2:emojiList.lenth>0}" scroll-y
scroll-with-animation>
<view id="msglistview">
</view>
</scroll-view>
scrollToBottom() {
let that = this
let query = uni.createSelectorQuery()
query.select('#scrollview').boundingClientRect()
query.select('#msglistview').boundingClientRect()
query.exec((res) => {
// console.log(res)
console.log(res)
//获取所有内部子元素的高度
//判断子元素高度是否大于显示高度
if (res[1].height > res[0].height) {
// 用子元素的高度减去显示的高度就获益获得滚动的高度
that.scrollTop = res[1].height - res[0].height
}
})
},
goclose() {
this.$emit('gethide', 0)
},
fasong() {
var data = {
'user': 'Jonas gegw',
'desc': '',
'num': 90,
'time': moment().format("YYYY-MM-DD HH:mm:ss"),
'like': false
}
data.desc = this.textareaVal
this.list.push(data)
this.textareaVal = ''
this.$nextTick(() => {
this.scrollToBottom()
})
},
滚动到底部
scrollToButtom() {
const query = uni.createSelectorQuery().in(this);
let nodesRef = query.select('#message-scroll');
nodesRef
.boundingClientRect(res => {
this.$nextTick(() => {
//进入页面滚动到底部
this.scrollTop = res.height;
});
})
.exec();
},