uniapp支付方式单选框
时间: 2023-08-09 11:10:23 浏览: 157
在 UniApp 中,你可以使用单选框来实现支付方式的选择。以下是一个简单的示例代码:
```html
<template>
<view>
<text>选择支付方式:</text>
<radio-group v-model="selectedPayment">
<label class="radio" for="wechat">
<radio id="wechat" value="wechat">微信支付</radio>
</label>
<label class="radio" for="alipay">
<radio id="alipay" value="alipay">支付宝支付</radio>
</label>
</radio-group>
</view>
</template>
<script>
export default {
data() {
return {
selectedPayment: 'wechat' // 默认选择微信支付
}
}
}
</script>
```
在上面的示例中,我们使用了 `radio-group` 组件来包裹两个 `radio` 组件,并使用 `v-model` 指令来绑定选择的支付方式到 `selectedPayment` 变量。当用户选择其中一个选项时,`selectedPayment` 的值将被更新为对应的选项值('wechat' 或 'alipay')。
你可以根据实际情况进行样式和逻辑的调整,以适应你的应用程序需求。
阅读全文