colorui框架里的 scroll-view 如何位于最底部
时间: 2024-01-25 13:02:04 浏览: 119
在 ColorUI 框架中,要将 scroll-view 定位到最底部,你可以使用以下步骤:
1. 首先,在 scroll-view 组件中设置一个唯一的 id 属性,例如 `id="my-scroll-view"`。
2. 在页面的 onLoad 函数中,获取 scroll-view 组件的高度和滚动高度。
```javascript
Page({
onLoad: function () {
var that = this;
wx.createSelectorQuery().select('#my-scroll-view').boundingClientRect(function(rect){
that.setData({
scrollViewHeight: rect.height,
});
}).exec();
},
});
```
3. 在页面的 wxml 中,将 scroll-view 组件的高度设置为页面高度,并将滚动高度设置为 `scrollViewHeight`。
```html
<scroll-view id="my-scroll-view" style="height:{{scrollViewHeight}}px;" scroll-top="{{scrollViewHeight}}">
<!-- scroll-view 内容 -->
</scroll-view>
```
这样,scroll-view 组件将会默认显示在最底部,并且当内容超过 scroll-view 高度时,会自动滚动到最底部。注意,由于使用了 `wx.createSelectorQuery()`,这个方法是微信小程序提供的 API,因此仅适用于微信小程序开发。
阅读全文