uniapp 一个简单的 单选 功能的实现

uniapp 实现单选功能 刚开始学习时没有百度到 ，现在记录一下

 

<view>
							<view>付款类型</view>
							<view>
								<radio-group @change="payPersonRadioChange">
									<label v-for="(item, index) in payPerson" :key="index">
										<view class="radio-item">
											<radio :value="index + ''" color="#FF6000"
												:checked="index === payPersonIndex"  />
										</view>
										<view>
											<text :class="[index == payPersonIndex?'fontcolour':'']">{{item.value}}
											</text>
										</view>
									</label>
								</radio-group>
							</view>
						</view>

循环的数据，可以根据情况增加，反正是只能选一个， 根据change事件 ，点击确定点击的是第几个 ，然后动态class 根据 :key判断是否为当前的

payPerson: [{
				value: '发货方付',
				key: "1"
			}, {
				value: '收货方付',
				key: "0"
			}],

payPersonRadioChange(e) {
			this.payPersonIndex = e.detail.value
		},