完成首页初始化搭建

pages.json

@@ -16,18 +16,64 @@
 			"style" : {
 				"navigationStyle":"custom",
 				"navigationBarTitleText": "",
-				"enablePullDownRefresh": true,
+				"enablePullDownRefresh": false,
 				"app-plus": {
 					"titleNView": false
 				}
 			}
+		},
+		{
+			"path" : "pages/chat/chat",
+			"style" : 
+			{
+				"navigationBarTitleText": "消息",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"autoBackButton": false,
+					"titleNView": true
+				}
+			}
+		},
+		{
+			"path" : "pages/personalCenter/personalCenter",
+			"style" : 
+			{
+				"navigationBarTitleText": "我的",
+				"enablePullDownRefresh": false,
+				"app-plus": {
+					"titleNView": false,
+					"autoBackButton": false
+				}
+			}
 		}
 	],
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
 		"navigationBarTitleText": "uni-app",
 		"navigationBarBackgroundColor": "#F8F8F8",
-		"backgroundColor": "#fff"
+		"backgroundColor": "#F7F7F7"
+	},
+	"tabBar": {
+		"list": [
+			{
+				"pagePath": "pages/index/index",
+				"text": "主页",
+				"iconPath": "static/tabbar-icon/home.png",
+				"selectedIconPath": "static/tabbar-icon/home-fill.png"
+			},
+			{
+				"pagePath": "pages/chat/chat",
+				"text": "消息",
+				"iconPath": "static/tabbar-icon/comment.png",
+				"selectedIconPath": "static/tabbar-icon/comment-filling.png"
+			},
+			{
+				"pagePath": "pages/personalCenter/personalCenter",
+				"text": "我的",
+				"iconPath": "static/tabbar-icon/user-line.png",
+				"selectedIconPath": "static/tabbar-icon/user-s.png"
+			}
+		]
 	},
 	"uniIdRouter": {}
 }

pages/chat/chat.vue

@@ -0,0 +1,24 @@
+<template>
+	<view class="containerx">
+		<view class="page-content">
+			消息
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	
+	onLoad(() => {
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss" scoped>
+	.containerx {
+		height: 100vh;
+		width: 100vw;
+		background-color: #f7f7f7;
+	}
+</style>

pages/index/index.vue

@@ -1,27 +1,31 @@
 <template>
 	<view class="containerx">
-		<!-- <u-tabbar v-model="tabbarCurrent" :list="tabbarList" :mid-button="true"></u-tabbar> -->
-		<u-button type="primary">主要按钮</u-button>
+		<view :style="{height: statusBarHeight + 'px'}"></view>
+		<!-- <view :style="{height: navBarHeight + 'px'}"></view> -->
+		<view class="page-content">
+			主页
+		</view>
 	</view>
 </template>
 
 <script setup>
 	import { ref } from 'vue'
-	import { onLoad } from '@dcloudio/uni-app'
+	import { onReady, onLoad } from '@dcloudio/uni-app'
 	
-	const tabbarCurrent = ref(0)
-	const tabbarList = ref([
-		{
-			text: '首页',
-		},
-		{
-			text: '消息',
-		},
-		{
-			text: '我的',
-		}
-	])
+	// 屏幕状态栏高度
+	const statusBarHeight = ref(0)
+	// 顶部导航栏高度
+	const navBarHeight = ref(0)
 	
+	onReady(() => {
+		uni.getSystemInfo({
+			success(e) {
+				statusBarHeight.value = e.statusBarHeight;
+				let custom = uni.getMenuButtonBoundingClientRect();
+				navBarHeight.value = custom.height + (custom.top - e.statusBarHeight) * 2;
+			}
+		})
+	})
 	onLoad(() => {
 		console.log('onLoad')
 	})
@@ -29,6 +33,8 @@
 
 <style lang="scss" scoped>
 	.containerx {
-		
+		height: 100vh;
+		width: 100vw;
+		background-color: #f7f7f7;
 	}
 </style>

pages/personalCenter/personalCenter.vue

@@ -0,0 +1,24 @@
+<template>
+	<view class="containerx">
+		<view class="page-content">
+			我的
+		</view>
+	</view>
+</template>
+
+<script setup>
+	import { ref } from 'vue'
+	import { onLoad } from '@dcloudio/uni-app'
+	
+	onLoad(() => {
+		console.log('onLoad')
+	})
+</script>
+
+<style lang="scss" scoped>
+	.containerx {
+		height: 100vh;
+		width: 100vw;
+		background-color: #f7f7f7;
+	}
+</style>