uni-app 实现循环多规格（多选功能）

<template>
	<view class="guigee">
		<view class="guigee_t" v-for="(item,indexc) in goodsMultiSpec.spec_attr" :key="indexc">
			<view class="guigee_t_t">
				<text>{{item.group_name}}</text>
			</view>
			<view class="guigee_t_s gui-flex gui-align-items-center gui-wrap">
				<view class="guigee_l gui-flex gui-align-items-center gui-justify-content-cente"
					v-for="(itemz,indexz) in item.spec_items" :key="indexz" @click="cilckG(indexc,indexz)"
					:class="itemz.checked?'guiee_l_a':''">
					<text>{{itemz.value}}</text>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	let goodsSpecArr = [];
	export default {
		data() {
			return {
				goodsMultiSpec: {
					spec_attr: [{
							group_name: '颜色',
							spec_items: [{
									id: '1',
									value: '白色',
									checked: true
								},
								{
									id: '2',
									value: '紫红',
									checked: ''
								}
							]
						},
						{
							group_name: '规格',
							spec_items: [{
									id: '1',
									value: '230',
									checked: true
								},
								{
									id: '2',
									value: '300',
									checked: ''
								}
							]
						}
					], //规格
				}


			}
		},
		onLoad(e) {

		},
		methods: {
			// 选择规格
			cilckG(one, two) {
				var attrIdx = one;
				var itemIdx = two;
				for (let i in this.goodsMultiSpec.spec_attr) {
					for (let j in this.goodsMultiSpec.spec_attr[i].spec_items) {
						if (attrIdx == i) {
							this.goodsMultiSpec.spec_attr[i].spec_items[j].checked = false;
							if (itemIdx == j) {
								this.goodsMultiSpec.spec_attr[i].spec_items[itemIdx].checked = true;
								goodsSpecArr[i] = this.goodsMultiSpec.spec_attr[i].spec_items[itemIdx].item_id;
							}
						}
					}
				}
			},
		}
	}
</script>

<style lang='less'>
	.guigee {
		width: 90%;
		height: 300rpx;
		margin: auto;
		margin-top: 20rpx;

		.guigee_t {
			width: 100%;
			height: auto;
			margin-top: 40rpx;

			.guigee_t_t {
				font-size: 30rpx;
				color: #999;
			}

			.guigee_t_s {
				width: 100%;
				height: auto;
				margin-top: 20rpx;

				.guigee_l {
					width: auto;
					height: 60rpx;
					border: 1rpx solid #e6e6e6;
					padding: 0rpx 30rpx 0rpx 30rpx;
					border-radius: 10rpx;
					font-size: 30rpx;
					margin-right: 25rpx;

				}

				.guiee_l_a {
					background: #FF2A36;
					color: #fff;
					border: 1rpx solid #FF2A36;
				}
			}
		}
	}
</style>