單選使用radio-group標簽包裹radio標簽
多選使用checkbox-group 標簽包裹checkbox標簽
?單選和多選的wxml代碼文章來源:http://www.zghlxwxcb.cn/news/detail-741108.html
<view class="form-container">
<!-- 實現單選 -->
<text>請輸入你最喜歡的水果</text>
<radio-group bindchange="">
<radio value="" />蘋果
<radio value="" />芒果
<radio value="" />火龍果
</radio-group>
<text>請選擇你最喜歡的電視劇</text>
<!-- 實現多選 -->
<checkbox-group bindchange="">
<view>
<checkbox value="" />狂飆
</view>
<view>
<checkbox value="" />奧特曼
</view>
<view>
<checkbox value="" />巴拉拉小魔仙
</view>
<view>
<checkbox value="" />今日說法
</view>
</checkbox-group>
</view>
以下是wxss代碼文章來源地址http://www.zghlxwxcb.cn/news/detail-741108.html
/* pages/form/form.wxss */
.form-container{
width: 100%;
padding: 20rpx;
}
radio-group{
width: 100%;
height: 100rpx;
display: flex;
align-items: center;
}
checkbox-group view{
width: 100%;
height: 100rpx;
}
到了這里,關于微信小程序——實現單選、多選的文章就介紹完了。如果您還想了解更多內容,請在右上角搜索TOY模板網以前的文章或繼續(xù)瀏覽下面的相關文章,希望大家以后多多支持TOY模板網!