uniapp获取页面可见高度
时间: 2023-08-03 15:05:47 浏览: 45
你可以使用下面的代码来获取当前页面的可见高度:
```
var height = uni.getSystemInfoSync().windowHeight;
```
其中,`uni.getSystemInfoSync()`是 uniapp 的 API,用于获取系统信息,包括窗口高度、宽度等。`windowHeight` 表示当前窗口的可用高度。
需要注意的是,由于不同设备的窗口高度可能不同,因此在使用时需要进行适当的兼容处理。同时,如果页面中存在导航栏、标签栏等组件,也需要考虑它们对页面高度的影响。
相关问题
uniapp获取获取页面高度
在uni-app中,可以通过以下几种方式获取页面高度:
1. 使用uni.getSystemInfoSync()方法获取系统信息,包括窗口高度。示例代码如下:
```
let res = uni.getSystemInfoSync();
let windowHeight = res.windowHeight;
console.log(windowHeight);
```
2. 使用uni.createSelectorQuery()方法创建一个查询实例,然后使用selectViewport()方法选择视窗,最后使用boundingClientRect()方法获取视窗的高度。示例代码如下:
```
uni.createSelectorQuery().selectViewport().boundingClientRect(function(rect) {
let windowHeight = rect.height;
console.log(windowHeight);
}).exec();
```
3. 使用uni.getSystemInfo()方法异步获取系统信息,然后在回调函数中获取窗口高度。示例代码如下:
```
uni.getSystemInfo({
success: function(res) {
let windowHeight = res.windowHeight;
console.log(windowHeight);
}
});
```
以上是uni-app中获取页面高度的几种方式,你可以根据自己的需求选择适合的方法来获取页面高度。
uniapp 获取页面高度
在 Uniapp 中,你可以通过 `uni.getSystemInfo` 方法获取页面的高度。下面是一个示例代码:
```javascript
// 在页面的生命周期函数中获取页面高度
onLoad() {
this.getPageHeight();
},
methods: {
getPageHeight() {
uni.getSystemInfo({
success: res => {
console.log('页面高度:', res.windowHeight);
}
});
}
}
```
在上面的例子中,我们使用 `uni.getSystemInfo` 方法获取系统信息,其中包含了页面的高度。通过 `res.windowHeight` 可以获取到页面的高度。你可以在 `success` 回调函数中处理获取到的页面高度。
请注意,这段代码需要在页面的生命周期函数中执行,比如 `onLoad`,以确保能够正确获取到页面的高度。