1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
  | <template> 
 |      <view :style="{ height: statusBarHeight }" class="uni-status-bar"> 
 |          <slot /> 
 |      </view> 
 |  </template> 
 |    
 |  <script> 
 |      export default { 
 |          name: 'UniStatusBar', 
 |          data() { 
 |              return { 
 |                  statusBarHeight: 20 
 |              } 
 |          }, 
 |          mounted() { 
 |              this.statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px' 
 |          } 
 |      } 
 |  </script> 
 |    
 |  <style lang="scss" > 
 |      .uni-status-bar { 
 |          // width: 750rpx; 
 |          height: 20px; 
 |          // height: var(--status-bar-height); 
 |      } 
 |  </style> 
 |  
  |