1

pages.json

@@ -1,17 +1,59 @@
 {
 	"pages": [{
-		"path": "pages/index/index",
+		"path": "pages/cardHolder/cardHolder",
 		"style": {
-			"navigationBarTitleText": "uni-app"
+			"navigationBarTitleText": "电子名片",
+			"enablePullDownRefresh": false
 		}
+
+	}, {
+		"path": "pages/circle/circle",
+		"style": {
+			"navigationBarTitleText": "圈子",
+			"enablePullDownRefresh": false
+		}
+
+	}, {
+		"path": "pages/mySet/mySet",
+		"style": {
+			"navigationBarTitleText": "我的",
+			"enablePullDownRefresh": false
+		}
+
 	}],
+	"tabBar": {
+		"custom": false,
+		"color": "#656765",
+		"selectedColor": "#000102",
+		"borderStyle": "white",
+		"backgroundColor": "#ffffff",
+		"list": [{
+				"pagePath": "pages/cardHolder/cardHolder",
+				"iconPath": "static/11.png",
+				"selectedIconPath": "static/1.png",
+				"text": "电子名片"
+			},
+			{
+				"pagePath": "pages/circle/circle",
+				"iconPath": "static/11.png",
+				"selectedIconPath": "static/1.png",
+				"text": "圈子"
+			},
+			{
+				"pagePath": "pages/mySet/mySet",
+				"iconPath": "static/4.png",
+				"selectedIconPath": "static/44.png",
+				"text": "我的"
+			}
+		]
+	},
 	"globalStyle": {
 		"navigationBarTextStyle": "black",
-		"navigationBarTitleText": "uni-app",
+		"navigationBarTitleText": "电子名片",
 		"navigationBarBackgroundColor": "#F8F8F8",
 		"backgroundColor": "#F8F8F8",
 		"app-plus": {
 			"background": "#efeff4"
 		}
 	}
-}
+}

pages/cardHolder/cardHolder.vue

@@ -0,0 +1,74 @@
+<template>
+	<view class="content">
+		<uni-row class="row1">
+			<uni-col :span="2" class="col">
+				<uni-icons type="scan" size="30"></uni-icons>
+			</uni-col>
+			<uni-col :span="22">
+				<uni-search-bar @confirm="search" :focus="true" v-model="searchValue" @blur="blur" @focus="focus"
+					@input="input" @cancel="cancel" @clear="clear" placeholder="搜索名片" cancelButton="none">
+				</uni-search-bar>
+			</uni-col>
+
+		</uni-row>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				searchValue: ''
+			};
+		},
+		methods: {
+			search(res) {
+				uni.showToast({
+					title: '搜索：' + res.value,
+					icon: 'none'
+				})
+			},
+			input(res) {
+				console.log('----input:', res)
+			},
+			clear(res) {
+				uni.showToast({
+					title: 'clear事件，清除值为：' + res.value,
+					icon: 'none'
+				})
+			},
+			blur(res) {
+				uni.showToast({
+					title: 'blur事件，输入值为：' + res.value,
+					icon: 'none'
+				})
+			},
+			focus(e) {
+				uni.showToast({
+					title: 'focus事件，输出值为：' + e.value,
+					icon: 'none'
+				})
+			},
+			cancel(res) {
+				uni.showToast({
+					title: '点击取消，输入值为：' + res.value,
+					icon: 'none'
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.content{
+		padding: 0 20rpx;
+	}
+.row1{
+	display: flex;
+	align-items: center;
+	.col{
+	display: flex;
+	align-items: center;
+	}
+}
+</style>

pages/circle/circle.vue

@@ -0,0 +1,19 @@
+<template>
+	<view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>

pages/mySet/mySet.vue

@@ -0,0 +1,19 @@
+<template>
+	<view>
+		
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+
+</style>