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
		},
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐