【微信小程序---radio单选框讲解】

radio 单选框

1 radio 标签 必须要和 父元素 radio-group 来使用

2 value 选中的单选框的值

3 需要给 radio-group 绑定 change 事件 bindchange=“handleChange”

4 需要在页面中显示选中的值

radio单选框.wxml

	男
	女


您选中的是：{{gender}}

radio单选框.js

Page({
  data: {
    gender: ""
  },
  handleChange(e) {
    console.log(e);
  }
})

 这里输出的e的位置就是选中单选框radio之后索取value中的值的存放位置

修改console.log代码

Page({
  data: {
    gender: ""
  },
  handleChange(e) {
    // console.log(e);
    // 1 获取单选框的值
    let gender=e.detail.value;
    // 2 把值 赋值给data中的数据
    this.setData({
      gender
    })
  }
})

 最后所显示的效果

 若想修改选中复选框中的绿色 换掉  radio标签中加入 color=“你想要的颜色”