uniapp选择题

uniapp选择题

页面部分代码

<view class="content">
			<view class="all">
				<view class="maintop">
					<text v-if="itempage==0" style="font-weight: bold;">1</text><text v-else="itempage!=0" style="font-weight: bold;">{{itempage/7+1}}</text>
					<text style="color: #808080;">/{{ti.length/7}}</text>
					<text v-if="ti[itempage+1].dd.length>1"class="btncs">多选题</text>
					<text v-if="ti[itempage+1].dd.length==1" class="btncs">单选题</text>
				</view>
				<view v-for="(item,index) in ti.slice(itempage,itempage+7)" class="main">
					<view class="titles">{{item.date}}</view>
					<view class="chiose"  v-for="(answ,i) in item.roomNums" @click="getansw(answ,item,i)" :key="i">
						<view v-if="checkArry.indexOf(i) !=-1" class="imgc"></view>
						<view v-if="checkArry.indexOf(i) ==-1" class="imgc1"></view>
						<text>{{answ.right}}.{{answ.name}}</text>
					</view>
				</view>
			</view>
			<view v-for="(item,index) in ti.slice(itempage,itempage+7)" v-if="item.has==true" class="next">
				<view class="nexts1">
					<text style="font-size: 32rpx;">正确答案</text>:<text style="color: red;font-size: 32rpx;" v-for="dd in ti[itempage+1].dd">{{dd}}</text>
				</view>
				<button v-if="itempage/7+1!=ti.length/7"  @click="next()" class="nexts2">下一题</button>
				<button v-if="itempage/7+1==ti.length/7" @click="next()" class="nexts2"  @tap="navchouj()">抽奖</button>
			</view>
		</view>

js代码

<script>
	export default {
		data() {
			return {
				chiosed:-1,//当前选中的选项下标 默认为-1 数组-1没有值 默认没有选中
				xz:false,
				show:0,//显示答题还是开始页面
				fail:0,//判断一共答了几道题目 最后一道的时候不再往下跳转到下一页
				title: '生态环境保护知识竞赛', //问卷题
				openid: '',//用户id
				userImg: '', //用户头像
				userName: '', //用户名称
				defen: 0, //得分
				itempage: 0,//判断页数
				ti: [],//题数组
			}
		},
		onLoad() {
		},
		methods: {
			
			getansw(answ, item,i) {
				let that = this;
				// 多选的效果 只有选中的选项加上效果
				if (that.checkArry.indexOf(i) == -1&&that.ti[that.itempage + 5].chioseNum + 1 <= that.ti[that.itempage + 1].dd.length) {
							// console.log(index); //打印下标
					that.checkArry.push(i); //选中添加到数组里
				} else {
					// that.checkArry.splice(that.checkArry.indexOf(i), 1); //取消选中效果
				}
				
				that.xz=true;
				that.chiosed=i;
				that.ti[that.itempage + 2].chiosed = answ.right; //当前选中
				//选的次数是否和正确答案的长度
				if (that.ti[that.itempage + 5].chioseNum + 1 == that.ti[that.itempage + 1].dd.length) {
					//判断选中是否在数组里面并且没有选过
					//在正确答案里面 并且没有选过
					if (that.ti[that.itempage + 3].chiose.indexOf(answ.right) == -1 && that.ti[that.itempage + 1].dd.indexOf(answ.right) !=-1) {
						that.ti[that.itempage + 3].chiose.push(answ.right); //历史选中
						that.ti[that.itempage + 5].chioseNum = that.ti[that.itempage + 5].chioseNum + 1; //选的次数
						that.ti[that.itempage + 2].has = true;
						that.defen += 1;
						that.fail+=1;
						setTimeout(function () {
							if(that.fail<that.ti.length/7){
								that.itempage = 7 + that.itempage;
								that.chiosed=-1;
								that.checkArry=[];
							}
						},1200);
						// that.itempage=7+that.itempage;
					} else if (that.ti[that.itempage + 3].chiose.indexOf(answ.right) == -1 && that.ti[that.itempage + 1].dd.indexOf(answ.right) == -1) { //没答案里面 没选过
						that.ti[that.itempage + 3].chiose.push(answ.right); //历史选中
						that.ti[that.itempage + 5].chioseNum = that.ti[that.itempage + 1].dd.length;
						that.ti[that.itempage + 2].has = true;
						that.fail+=1;
						that.defen += 0;
						// that.itempage=7+that.itempage;
						// console.log(that.itempage + 2);
					} else {
						// alert('请刷新或重新进入')
					}
				} else if (that.ti[that.itempage + 5].chioseNum + 1 < that.ti[that.itempage + 1].dd.length) {
					//在正确答案里面 并且没有选过
					if (that.ti[that.itempage + 3].chiose.indexOf(answ.right) == -1 && that.ti[that.itempage + 1].dd.indexOf(answ.right) !=-1) {
						that.ti[that.itempage + 3].chiose.push(answ.right); //历史选中
						that.ti[that.itempage + 5].chioseNum = that.ti[that.itempage + 5].chioseNum + 1; //选的次数
					} else if (that.ti[that.itempage + 3].chiose.indexOf(answ.right) == -1 && that.ti[that.itempage + 1].dd.indexOf(answ.right) == -1) { //没答案里面 没选过
						that.ti[that.itempage + 3].chiose.push(answ.right); //历史选中
						that.ti[that.itempage + 5].chioseNum = that.ti[that.itempage + 1].dd.length;
						that.ti[that.itempage + 2].has = true;
						that.fail+=1;
						// console.log(that.itempage + 1);
						that.defen += 0;
					} else {
						// alert('请刷新或重新进入')
					}
				} else {
					// alert('请刷新或重新进入')
				}
			}
			
	}
</script>