xiongmao/pages/my/my-address/my-address.vue

<!-- 收货地址 -->
<template>
	<view class="wrap">
		<view class="list">
			<view class="item" v-for="(item, index) in list" :key="index">
				<view class="item-top">
					<!-- <image src="../../../static/address-icon.png" class="address-icon" mode=""></image> -->
					<view class="circle-box">
						李
					</view>
					<view class="item-top-sidebar">
						<view class="name">
							小鱼
							<text class="number">15231263543</text>
							<view class="default-tag">默认</view>
						</view>
						<view class="msg">
							山东省 临沂市 兰山区 柳青街道 昆仑花园22号楼二单元404
						</view>
					</view>
					<button type="default" class="edit-btn">
						<image src="../../../static/edit-icon.png" mode="widthFix"></image>
					</button>
				</view>
				<view class="item-bottom">
					<view class="radio-row" @click="choseItem(index)">
						<image class="circle"
							:src="id == item.id ? '../../../static/circle-active.png' : '../../../static/circle.png'" />
						<text class="default">设置为默认地址</text>
					</view>
					<view class="btn-box">
						<button type="default">
							删除
						</button>
					</view>
				</view>
			</view>
		</view>
		<view class="footer">
			<button type="default" @tap="add">
				<image src="../../../static/add-icon2.png" mode=""></image>
				添加收货地址
			</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
						id: 0,
					},
					{
						id: 1,
					},
				],
				id: 0, //单选 初始化第一个高亮 
			}
		},
		methods: {
			/**
			 * 单选
			 */
			choseItem: function(index) {
				console.log(index)
				this.id = index;
			},
			/**
			 * 跳转新建收货地址
			 */
			add() {
				uni.navigateTo({
					url: '../add-address/add-address'
				})
			},
		}
	}
</script>


<style scoped lang="scss">
	@import "./my-address.css";
</style>