原因:
吸顶组件u-sticky和底部导航栏tabbar在点击切换页面时产生冲突,
sticky组件创建了Observer监听,切换页面,并且页面没有销毁时,导致组件仍然保持监听,所以出现Cannot read properties of null (reading 'bottom')报错。
利用是否开启吸顶功能
参数 | 说明 | 类型 | 默认值 | 可选值 |
---|---|---|---|---|
offset-top | 吸顶时与顶部的距离,单位rpx | String | Number | 0 | - |
index | 自定义标识,用于区分是哪一个组件 | String | Number | - | - |
enable | 是否开启吸顶功能 | Boolean | true | false |
bg-color | 组件背景颜色 | String | #ffffff | - |
z-index | 吸顶时的z-index 值 | String | Number | 970 | - |
h5-nav-height | 导航栏高度,自定义导航栏时(无导航栏时需设置为0 ),需要传入此值,单位px | String | Number | 44 | - |
解决方法
<template>
<view>
<u-sticky :enable="enable">
</u-sticky>
</view>
</template>
<script>
export default {
data() {
return {
enable: true
}
}
// 打开吸顶
onShow() {
this.enable= true
},
//关闭吸顶
onHide() {
this.enable= false
}
}
</script>