标签：文字 使用 down usb sync ack def rip top
引用插件：uniNavBar
<uni-nav-bar statusBar="true" backgroundColor="#59AAFE" color="#FFFFFF" class="status-bar"> <view slot="left">分类</view> <view>课程</view> <view slot="right"></view> </uni-nav-bar>
存在问题：
1. 给插件标签上定义css改变前、背景色是不行的。需要使用backgroundColor，color
2. 非具名插槽，默认中间显示的文字，不剧中，可以用flex布局，让左中右三个插槽平分，并让text剧中
3. 关于uni-nav-bar的height问题，从源码中看，他先定义了一个$nav-height: 44px;变量。
然后，如果定义statusBar=true，则又加入一个占位的组件
<uni-status-bar v-if="statusBar" />
跟踪这个组件的源码，发现里面放了一个空的view，高度为系统statusBarHeight，又写死了一个样式，高度是20px，style属于element级别，应该高于类吧。所以这个高度应该就是20px了。
<template>
<view :style="{ height: statusBarHeight }" class="uni-status-bar">
<slot />
</view>
</template>
<script>
var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + ‘px‘
export default {
name: ‘UniStatusBar‘,
data() {
return {
statusBarHeight: statusBarHeight
}
}
}
</script>
<style lang="scss" scoped>
.uni-status-bar {
width: 750rpx;
height: 20px;
// height: var(--status-bar-height);
}
</style>
那问题就来了，如果下面再放一个fix的组件，怎么把这个高度减去呢?44+20=64px。
我这里引用了一个mescroll的插件。
<mescroll-uni class="jp-course-list" ref="mescrollRef" @init="mescrollInit" @down="downCallback" @up="upCallback" :down="downOption" :up="upOption" :topbar="true" :top="74" >
在真机和小程序下测试通过
标签：文字 使用 down usb sync ack def rip top
原文地址：https://www.cnblogs.com/zhouyu629/p/13020685.html
