1.icon

1.type string 是 icon的类型，有效值：success, success_no_circle, info, warn, waiting, cancel, download, search, clear
2.size number/string 23 否 icon的⼤⼩
3.color string 否 icon的颜⾊，同css的color

image.png

"success|success_no_circle|info|warn|waiting|cancel|download|search|clear"


<icon class="" type="info" size="60" color="#0094ff">
    
</icon>

2.radio

可以通过radio-group来组成多项单选

image.png

其中可以在radio-group中设置事件 bindchange

<radio-group bindchange="bindChange">
      <radio color='red' value='male' >男 </radio>
      <radio  value='female'> 女</radio>
</radio-group>
<view >
    你要输入的是:{{gender}}
</view>

// pages/demo15/demo15.js
Page({

  data: {
    gender:''
  },
  bindChange(e){
    let gender=e.detail.value;
    this.setData({
      gender:gender
    })
  }
})

3.checkbox

不管是多选还是单选按钮 一般都需要加入<-group>这个东西
单选按钮跟多选按钮其实是一样的，用法没有什么改变.
代码如下：

list:[
      {
        id:0,
        name:"苹果",
        value:'apple'
      },
      {
        id:1,
        name:"香蕉",
        value:'bananer'
      },
      {
        id:2,
        name:"葡萄",
        value:'grape'
      }
    ],
    checkbox:[]
  },
 handleItemChange(e){
   console.log(e);
   const checkbox=e.detail.value;
   this.setData({
    checkbox:checkbox
   })

  }
--------------------------------------
<view>
    <checkbox-group bindchange="handleItemChange">
        <checkbox  value="{{item.value}}"  wx:for='{{list}}' wx:key="id">
          {{item.name}}
      </checkbox>
    </checkbox-group>   
</view>
<view>
    {{checkbox}}
</view>

效果如下

image.png