里面的练习题题目和选项都是动态获取的，提交的时候结果是多个单选题最终选择的值，重点是给单选组标签上加上change事件，多选通用，change事件内加一个回调，代码示例如下：

<template>
<view class="container1"><view class="content1"><!-- 固定头部 --><!--<my-head parentData="1"></my-head>--><!-- 底部内容显示区域 --><view class="bottom-content"><form @submit="tijiao"><view class="lx-top"><view class="lx-top-left"><!-- <view class="tl-onenum" v-for="(item,index) in list" :key="index" :class="item.res?'':'tlred'">{{index+1}}</view> --><view class="tl-onenum" @click="goTimu(index)" v-show="!yitijiao" v-for="(item,index) in list" :class="curtimu==index?'tlnow':''">{{index+1}}</view><view class="tl-onenum" @click="goTimu(index)" v-show="yitijiao" v-for="(item,index) in list" :class="item.res?'tlgreen':'tlred'">{{index+1}}</view><!-- <view class="tl-onenum tlred">1</view><view class="tl-onenum">2</view><view class="tl-onenum">3</view><view class="tl-onenum">4</view> --></view><view class="lx-top-right"><!-- <uni-countdown :font-size="16" :show-day="false" :hour="2" :minute="30" :second="0" color="#FFFFFF"background-color="#92bffa" class="daojishi"/> --><view class="lx-top-btns"><button class="tr-btn btn1" @click="shangti">上一题</button><button class="tr-btn btn2" @click="xiati">下一题</button><button class="tr-btn btn3" v-show="!yitijiao" form-type="submit">提交</button><uni-icons v-show="yitijiao" type="star" size="30" color="#666" @click="shoucang(curtimu,1)" v-if="list[curtimu].shoucang==false"></uni-icons><uni-icons v-show="yitijiao" type="star-filled" size="30" color="#ffb800" @click="shoucang(curtimu,2)" v-else></uni-icons><!-- <uni-icons type="star" size="30" color="#666" v-show="yitijiao"></uni-icons> --></view></view></view><view class="lx-bottom" v-for="(item,index) in list" :key="index" v-show="curtimu==index?'timushow':''"><view class="lx-bottom-left"><view class="timu-title">{{index+1}}.{{item.timu}}</view><view class="timu-xuanxiang"><!-- <radio-group v-model="item.userres"> --><radio-group @change="(e=>{change(e,index)})"><label class="label-one" v-for="(item2,index2) in item.xuanxiang" :key="index2"><radio :value="item2.value" :disabled="yitijiao?true:false"/><text>{{item2.value}}.{{item2.label}}</text></label><!-- <label class="label-one"><radio value="B" /><text>B.200</text></label><label class="label-one"><radio value="C" /><text>C.150</text></label><label class="label-one"><radio value="D" /><text>D.10000</text></label> --></radio-group></view></view><view class="lx-bottom-right" v-show="yitijiao"><view class="br-title">相关知识点</view><view class="br-content">{{item.zhishidian}}</view><view class="br-title">技巧</view><view class="br-content">{{item.jiqiao}}</view><button class="btn-see" @click="seevideo" v-show="!item.res">观看技巧视频</button><!-- <view class="br-title">相关知识点</view><view class="br-content">1.仔细审题，阅读有关的内容，认真思考。组织答案。<br/>2.检查，列公式仔细核对。</view><view class="br-title">技巧</view><view class="br-content">1.列公式。<br/>2.看清数字。</view><button class="btn-see" @click="seevideo">观看技巧视频</button> --></view></view></form><!-- 视频弹窗 --><uni-popup ref="popupvideo"><view class="tan-login"><!-- <view class="log">视频解析</view> --><!-- <view class="zm"> --><video class="video1" poster="../../../static/videobg.png"></video><!-- </view> --><!-- <view class="tc-btnbox"><button class="tc-btn1" @click="">关闭</button></view> --></view></uni-popup></view></view>
</view>
</template><script>// import myHead from "@/components/myHead.vue" //公共头部组件export default {data() {return {list:[{id:1,shoucang:false,timu:"下列各数中，最小的数是",xuanxiang:[{value:'A',label:"0.5"},{value:'B',label:"0.05"},{value:'C',label:"0.005"},{value:'D',label:"0.0005"},],daan:"D",//正确的答案userres:'',  //用户选择的结果zhishidian:"小数点之后的知识点",jiqiao:"技巧内容",video:"",res:true,//结果，默认是对的，试题的背景色蓝色},{id:2,shoucang:false,timu:"下列各图形中，既是长方形又是正方形的是",items:['A. 矩形','B. 正方形','C. 三角形','D. 梯形'],xuanxiang:[{value:'A',label:"矩形"},{value:'B',label:"正方形"},{value:'C',label:"三角形"},{value:'D',label:"菱形"},],daan:"B",userres:'',zhishidian:"知识点",jiqiao:"技巧内容",video:"",res:true,},],//练习习题列表curtimu:0,//当前做的题目是第几题，默认从第一题开始，第一题在数组的下标值为0yitijiao:false,//是否提交过了，默认没提交}},components:{// myHead,},methods: {//选项改变事件--单选多选通用change(e,index){;console.log("change事件触发e:",e);console.log("在题目数组中的下标值index：",index);console.log("选中的结果：",e.detail.value);this.list[index].userres=e.detail.value;//用户选中的选项赋值},//点击题目序号跳转到当前题目goTimu(index){this.curtimu=index;},//上一题按钮shangti(){let cur=this.curtimu;if(cur==0){console.log("是第一题，没上一题")}else{cur=cur-1;this.curtimu=cur;}},//下一题按钮xiati(){let cur=this.curtimu;if(cur==(this.list.length-1)){console.log("是最后一题，没下一题")}else{cur=cur+1;this.curtimu=cur;}},//提交按钮tijiao(){let that=this;that.yitijiao=true;let list=that.listfor(let i=0;i<list.length;i++){if(list[i].daan==list[i].userres){list[i].res=true}else{list[i].res=false}}that.list=listconsole.log("提交后的list",list)},//查看视频seevideo(){this.$refs.popupvideo.open(); //打开弹窗},//收藏按钮点击事件shoucang(index,state){let that=thisconsole.log("当前点击的收藏index,状态",index,state)if(state==1){this.list[index].shoucang=true;}else{this.list[index].shoucang=false;}},//提交按钮点击事件// formSubmit(e){// 	let that=this;// 	console.log("提交点击e",e);// 	let obj=e.detail.value;//对象// 	uni.navigateBack({// 		delta:1,//返回上一级页面// 	});// }}}
</script><style scoped>
.lx-top,.lx-bottom{display: flex;/* align-items: center; */justify-content: space-between;background-color: #fff;padding: 20rpx;box-sizing: border-box;margin: 30rpx;margin-top: 180rpx;/* border-radius: 10rpx; */
}
.lx-top{margin-bottom: 0;border-top-left-radius: 10rpx;border-top-right-radius: 10rpx;
}
.lx-bottom{margin-top: 0;border-bottom-left-radius: 10rpx;border-bottom-right-radius: 10rpx;
}
.lx-bottom-left{flex: 2;border-right: 1px dotted #ddd;margin-right: 20rpx;padding-right: 20rpx;box-sizing: border-box;
}
.lx-bottom-right{flex: 1;
}
.lx-top-left{display: flex;align-items: center;flex:2;flex-wrap: wrap;
}
.tl-onenum{font-size: 34rpx;color: #fff;background: #0273ff;width: 60rpx;height: 60rpx;line-height: 60rpx;text-align: center;border-radius: 50%;margin:5rpx 10rpx;
}
.tlnow{background-color:#fff;color: #0070e6;border: 1px solid #0070e6;
}
.tlred{background-color: red;
}
.tlgreen{background-color: green;
}
.nowtimu{background-color: aqua;
}
.lx-top-right{flex:1;
}
.daojishi{margin-left: 400rpx;margin-bottom: 10rpx;
}
.lx-top-btns{flex:1;display: flex;align-items: center;
}
.tr-btn{padding: 0rpx 30rpx;margin: 0;margin-right: 20rpx;font-size: 34rpx;border-radius: 50rpx;height: 70rpx;line-height: 70rpx;
}
.btn1{color: #0070e6;border:1px solid #346b94;
}
.btn2{color: #fff;background-color: #0273ff;
}
.btn3{color: #fff;background-color: darkred;
}
.timu-title{font-size: 34rpx;padding-bottom: 20rpx;
}
.timu-xuanxiang{padding-bottom: 10rpx;font-size: 32rpx;
}
.label-one{display: block;margin-bottom: 10rpx;
}
.br-title{font-size: 36rpx;padding-bottom: 20rpx;
}
.br-content{font-size: 32rpx;color: #666;line-height: 50rpx;padding: 5rpx 0 30rpx;
}.btn-see{padding: 0;margin: 0;font-size: 32rpx;width: 300rpx;height: 80rpx;line-height: 80rpx;color: #0070e6;border:1px solid #346b94;border-radius: 60rpx;margin: 0 auto;
} 
.video1{width: 1400rpx;height: 1000rpx;
}</style>

效果图：