feat: 自定义导航栏增加状态栏设置 ,标题左侧显示

components/uni-navbar-lite/uni-navbar-lite.uvue

@@ -4,7 +4,7 @@
             <view class="left-content" @click="back">
                 <text class="uni-icons">{{unicode}}</text>
             </view>
-            <view class="uni-navbar-content">
+            <view class="uni-navbar-content" :class="{'is-left':isLeft}">
                 <slot>{{title}}</slot>
             </view>
             <view class="right-content">
@@ -23,11 +23,7 @@
         		type: String,
         		default: ''
         	},
-        	open: {
-        		type: Boolean,
-        		default: false
-        	},
-        	disabled: {
+        	isLeft: {
         		type: Boolean,
         		default: false
         	}
@@ -55,11 +51,19 @@
                     console.log(err);
                 },
             })
-
             const sys = uni.getSystemInfoSync()
             const statusBarHeight = sys.statusBarHeight
             this.statusBarHeight = statusBarHeight
         },
+        mounted() {
+          // TODO 暂时加定时器，否则不生效
+          setTimeout(() => {
+            uni.setNavigationBarColor({
+                frontColor: '#000000',
+                backgroundColor: '#ffffff'
+            })
+          }, 100)
+        },
         methods: {
             back() {
                 uni.navigateBack({})
@@ -104,7 +108,11 @@
         left: 45px;
         right: 45px;
         display: flex;
+        flex-direction: row;
         justify-content: center;
         align-items: center;
     }
+    .is-left {
+      justify-content: flex-start;
+    }
 </style>

pages/template/navbar-lite/navbar-lite.uvue

 <template>
   <view class="content">
-    <uni-navbar-lite :title="title"></uni-navbar-lite>
+    <uni-navbar-lite :title="title" :is-left="isLeft"></uni-navbar-lite>
     <scroll-view class="scroll-view" scroll-y="true">
+      <view class="content-item" @click="onClick">
+        <text>点击标题切换为左侧显示</text>
+      </view>
       <view class="content-item" v-for="item in 100">
-        <text class="text">内容：{{item+1}}</text>
+        <text class="text">内容：{{item}}</text>
       </view>
     </scroll-view>
   </view>
@@ -13,11 +16,16 @@
   export default {
     data() {
       return {
-        title: 'Hello uni-app'
+        title: 'Hello uni-app',
+        isLeft: false
       }
     },
-    onLoad() {},
-    methods: {}
+    onLoad() { },
+    methods: {
+      onClick(){
+        this.isLeft = !this.isLeft
+      }
+    }
   }
 </script>