1

src/components/navbar.vue

+<template>
+	<view  class="navbar" :style="{'padding-top':`${statusBarHeight}px`}">
+		<slot></slot>
+	</view>
+</template>
+
+<script>
+import {
+  ref,
+  reactive,
+  toRefs,
+  toRef,
+  getCurrentInstance,
+  watch,
+  computed,
+  onMounted,
+} from "vue";
+export default {
+  setup() {
+    let data = reactive({
+		statusBarHeight:24
+    });
+	const os = uni.getSystemInfoSync();
+	data.statusBarHeight=os.statusBarHeight
+    return {
+      ...toRefs(data),
+    };
+  },
+};
+</script>
+
+<style scoped>
+	.navbar{
+		height: 100rpx;
+	}
+</style>

src/pages/index/index.vue

 <template>
   <view class="page-box">
-    <van-nav-bar :border="fasle" fixed :z-index="99">
+    <!-- <van-nav-bar :border="fasle" fixed :z-index="99">
       <view slot="left" class="page-title" title="shouye">首页</view>
-    </van-nav-bar>
-    <view class="con" :style="{ 'padding-top': `${statusBarHeight}px` }">
-      <view style="height: 100rpx"></view>
+    </van-nav-bar> -->
+	<navbar>
+		<view class="navbar-con">
+			<view class="pagetitle">
+				首页
+			</view>
+		</view>
+	</navbar>
+    <view class="con">
       <view class="personInfo flex flex_start_center">
         <van-image
           round
@@ -308,9 +314,11 @@ import { getIndexInfo } from "../../api/index";
 import { getActivityList } from "../../api/activity";
 import { desensitization } from "../../utils/index";
 import indexassembly from './components/indexassembly.vue'
+import navbar from '../../components/navbar.vue'
 export default {
 	components: {
 	  indexassembly,
+	  navbar,
 	},
   setup(props) {
     let { proxy } = getCurrentInstance();
@@ -527,9 +535,21 @@ export default {
 </script>
 
 <style scoped>
+	.navbar-con{
+		height: 100%;
+		box-sizing: border-box;
+		padding: 0 30rpx;
+		display: flex;
+		align-items: center;
+	}
+	.pagetitle{
+		font-size: 46rpx;
+		font-weight: 800;
+		color: #111111;
+	}
 .con {
   box-sizing: border-box;
-  padding: 100rpx 30rpx 50rpx;
+  /* padding: 0rpx 30rpx 50rpx; */
 }
 
 .page-title {