优化picker

subpackage/orders/addAddress.vue

@@ -9,8 +9,9 @@
 					maxlength="11" />
 			</u-form-item>
 			<u-form-item label="所在地区">
-				<u-input :customStyle="btnGetCode" type="select" :select-open="state.show"
-					v-model="state.formData.region" placeholder="省 市 区" @click="state.show = true"></u-input>
+				<picker mode="region" :value="state.formData.region" @change="regionConfirm">
+					<view class="choice-picker">{{state.formData.region?state.formData.region:"请选择"}}</view>
+				</picker>
 			</u-form-item>
 
 			<u-form-item label="详细地址">
@@ -32,7 +33,6 @@
 		<view class="action">
 			<button type="default" class="button" @click="savaHandle()">保存</button>
 		</view>
-		<u-picker mode="region" v-model="state.show" @confirm="regionConfirm"></u-picker>
 	</view>
 </template>
 
@@ -68,7 +68,6 @@
 			orderId: '',
 			whetherToMail: 0,
 		},
-		show: false,
 		isDefault: false,
 	});
 
@@ -80,7 +79,8 @@
 	};
 	// 选择地区回调
 	const regionConfirm = (e : any) => {
-		state.formData.region = e.province.name + e.city.name + e.area.name;
+		console.log("e",e.detail.value)
+		state.formData.region = e.detail.value[0] + e.detail.value[1] + e.detail.value[2];
 	};
 
 	const savaHandle = () => {
@@ -116,10 +116,6 @@
 				showLoading: true,
 			};
 			request(code, options).then((res) => {
-				// msg("新增地址成功");
-				// uni.navigateBack({
-				//   delta: 1,
-				// });
 				let options2 = {
 					type: 2,
 					data: state.formData,
@@ -215,4 +211,11 @@
 			line-height: 80rpx;
 		}
 	}
+	.choice-picker{
+		background: #F1F1F1;
+		border-radius: 20rpx;
+		padding: 10rpx 20rpx;
+		height: 40px;
+		color: rgb(135, 135, 135);
+	}
 </style>

subpackage/orders/editAddress.vue

@@ -9,8 +9,9 @@
 					maxlength="11" />
 			</u-form-item>
 			<u-form-item label="所在地区">
-				<u-input :customStyle="btnGetCode" type="select" :select-open="state.show"
-					v-model="state.formData.region" placeholder="省 市 区" @click="state.show = true"></u-input>
+					<picker mode="region" :value="state.formData.region" @change="regionConfirm">
+						<view class="choice-picker">{{state.formData.region?state.formData.region:"请选择"}}</view>
+					</picker>
 			</u-form-item>
 
 			<u-form-item label="详细地址">
@@ -32,7 +33,6 @@
 			<button type="default" class="button-default" @click="deleteHandle()">删除</button>
 			<button type="default" class="button" @click="savaHandle()">保存</button>
 		</view>
-		<u-picker mode="region" v-model="state.show" @confirm="regionConfirm"></u-picker>
 	</view>
 </template>
 
@@ -81,7 +81,6 @@
 			openId: undefined,
 			id: undefined,
 		},
-		show: false,
 	});
 	//switch 事件
 	const changeSwitch = (e : any) => {
@@ -92,7 +91,7 @@
 
 	// 选择地区回调
 	const regionConfirm = (e : any) => {
-		state.formData.region = e.province.name + e.city.name + e.area.name;
+		state.formData.region = e.detail.value[0] + e.detail.value[1] + e.detail.value[2];
 	};
 
 	const savaHandle = () => {
@@ -225,4 +224,11 @@
 			line-height: 80rpx;
 		}
 	}
+	.choice-picker{
+		background: #F1F1F1;
+		border-radius: 20rpx;
+		padding: 10rpx 20rpx;
+		height: 40px;
+		color:black;
+	}
 </style>