【快速文档】radio标签，小程序中的单选框是这样做的

最新推荐文章于 2024-08-01 21:41:04 发布

「已注销」

最新推荐文章于 2024-08-01 21:41:04 发布

阅读量697

点赞数

分类专栏：小程序快速文档文章标签：小程序

本文链接：https://blog.csdn.net/wechat_wuming/article/details/120599826

版权

29 篇文章 1 订阅

订阅专栏

本文介绍了如何在微信小程序中使用radio单选框和radio-group组件进行交互，包括绑定change事件、value属性设置和基本用法实例。通过简单示例和关键代码展示，让开发者快速上手单选框的使用技巧。

摘要由CSDN通过智能技术生成

组合

radio 一个单选框的选项

radio-group 一组单选框

这两个标签需要配套使用

radio-group可以绑定bindchange，来触发change事件

radio需要设置value属性，来让单选框和其值进行绑定，还可以设置color，让单选框好看一些

在wxml中应该这样写

<radio-group bindchange="boy_or_girl">
  <radio value="boy">我是男孩子</radio>
  <radio value="girl">我是女孩子</radio>
</radio-group>

在js中应该这样写(函数添加到Page对象中)

boy_or_girl(e){
  console.log(e.detail.value);
}

注意，绑定的value内容，在e.detail.value里面，以后，这个属性会经常遇到。

此时，你选择男孩子，那么e.detail.value中保存的就会是boy，选择女孩子，那么e.detail.value中保存的就会是girl。

这里可以看出，小程序中的单选框使用，还是非常简单的，听懂掌声～

关注

专栏目录