``` <template> <view> <view class="uni-padding-wrap uni-common-mt"> <view> <checkbox-group @change="checkboxChange2"> <label> <checkbox value="多選1" checked="true" color="#FFCC33" style="transform:scale(0.7)" />選中 </label> <label> <checkbox value="多選2" color="#FFCC33" />未選中 </label> </checkbox-group> </view> </view> <radio-group @change="radioChange"> <label class="uni-list-cell uni-list-cell-pd"> <view> <radio value="單選1" /> </view> <view>選中1</view> </label> <label class="uni-list-cell uni-list-cell-pd"> <view> <radio value="單選2" /> </view> <view>選中2</view> </label> </radio-group> <view> <!-- @chang 是松開后的值 --> <slider value="50" @changing="sliderChange" step="1" activeColor="#FFCC33" backgroundColor="#000000" block-color="#8A6DE9" block-size="20" min="50" max="200" show-value/> </view> </view> </template> <script> export default { data() { return {} }, methods: { checkboxChange2(e){//多選=數組 this.toast(JSON.stringify(e.detail.value)) },radioChange(e) {//單選 this.toast(e.detail.value) },sliderChange(e) {//滑塊 console.log('value 發生變化：' + e.detail.value) },toast(e){ uni.showToast({ title:e, // mask:true, //蒙版 duration:2000 }) } } } </script> <style> .uni-list-cell { justify-content: flex-start } </style> ```