更新记录
1.0.2(2023-12-25)
下载此版本
细节优化
1.0.1(2023-11-27)
下载此版本
修改说明文档
1.0.0(2023-11-26)
下载此版本
初始版本
查看更多
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 3.1.0 app-vue app-nvue |
√ |
√ |
√ |
√ |
√ |
√ |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
√ |
√ |
√ |
√ |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
√ |
piaoyi-status-bar 自定义头部
使用示例如下:
<view class="piaoyi-status-bar">
<piaoyi-status-bar>
<view class="header" :barHeight="barHeight">
<text>标题</text>
<text>标题</text>
<text>标题</text>
</view>
</piaoyi-status-bar>
</view>
<script>
import PiaoyiStatusBar from '@/uni_modules/piaoyi-status-bar/components/piaoyi-status-bar/piaoyi-status-bar.vue'
export default {
data() {
return {
barHeight: '80rpx'
}
},
components: {
PiaoyiStatusBar
},
mounted() {
}
}
</script>
<style lang="scss" scoped>
.piaoyi-status-bar {
background: #eee;
height: 100vh;
}
.header {
font-size: 28rpx;
line-height: 28rpx;
font-weight: 700;
padding: 0 30rpx;
text {
margin-right: 100rpx;
}
}
</style>
Prop
参数名称 |
描述 |
barHeight |
状态栏下的内容高度 |
可接定制化组件开发
右侧有本人代表作小程序二维码,可以扫码体验
如使用过程中有问题或有一些好的建议,欢迎加QQ群互相学习交流:120594820