微信小程序取radio-group的索引
时间: 2024-10-14 22:05:06 浏览: 27
微信小程序开发fLib-ma笔记
微信小程序中的 `radio-group` 是用于选择单选选项的组件,当你选择其中一个选项时,并不会直接返回该选项的内容,而是会返回所选选项的索引。这个索引是从0开始的,代表用户选择的是第一个选项、第二个选项,依此类推。
获取 `radio-group` 的当前选中项的索引,可以在你的 `.wxml` 文件中设置 `bindchange` 事件处理函数,在对应的 `.js` 或者 `.json` 文件的 JavaScript 部分编写如下:
```html
<view class="radio-group">
<radio-group bindchange="onRadioChange" value="{{selectedIndex}}">
<radio label="选项一"> </radio>
<radio label="选项二"> </radio>
<!-- 更多选项 -->
</radio-group>
</view>
<script>
Page({
data: {
selectedIndex: -1, // 初始化默认值
},
onRadioChange(e) { // 当用户点击时触发此函数
this.setData({selectedIndex: e.detail.value}); // 更新数据,保存新的索引
}
})
</script>
```
在这个例子中,当用户选择一个新的选项后,`onRadioChange` 函数会被调用,`e.detail.value` 就是当前选中项的索引,然后你在 `data` 中的 `selectedIndex` 变量就会更新为新的值。
阅读全文