uniapp-商城-40-shop 购物车选好了进行订单确认4 配送方式3 地址编辑

原创

于 2025-04-27 20:22:15 发布 · 1.2k 阅读

15 ·

CC 4.0 BY-SA版权

文章标签：

#uni-app

前面说了配送和地址页面

当地址页面为空或需要添加地址时，需要添加地址。

我的地址页面有个按钮就是添加地址

点击添加地址按钮后，就会跳转到地址添加的页面

1、添加地址页面

2、添加地址文件夹以及文件的创建

3、添加地址的代码

<template>
	<view class="addressForm">
		<!-- 地址编辑 -->
		<u--form
			labelPosition="top"
			:model="addressForm"
			:rules="addressRules"
			labelWidth="100"
			ref="uForm"			
		>
		
			<u-form-item
				label="姓名"
				prop="username"					
			>
				<u--input
					v-model="addressForm.username"
					placeholder="请输入姓名"
				></u--input>
			</u-form-item>
			
			
			<u-form-item
				label="联系电话"
				prop="mobile"					
			>
				<u--input
					v-model="addressForm.mobile"
					placeholder="请输入联系电话"
				></u--input>
			</u-form-item>
			
			<u-form-item
				label="详细地址"
				prop="address"					
			>
				<u--input
					v-model="addressForm.address"
					placeholder="请输入街道门牌号"
				></u--input>
			</u-form-item>
			
			<u-form-item la