目前代码如下：
js.
Page({
/**
* 页面的初始数据
*/
data: {
questions:[{
id: 1,
question: "你更喜欢独处还是聚会？",
options: ["独处", "聚会"],
correctAnswer: "独处",
},
{
id: 2,
question:"在社交场合，你更倾向于等待他人来与你交流还是主动与他人交流？",
options: ["等待他人交流", "主动交流"],
correctAnswer: "等待他人交流",
},
{
id: 3,
question: "当你遇到困难时，你更倾向于独自思考解决方案还是寻求他人的帮助？",
options: ["独自思考", "寻求他人帮助"],
correctAnswer: "独自思考",
},
{
id: 4,
question:"在交流过程中，你更注重倾听他人的观点还是表达自己的观点？",
options: ["倾听他人的观点", "表达自己的观点"],
correctAnswer: "倾听他人的观点",
},
{
id: 5,
question:"你更喜欢跟随他人的领导还是在团队中发挥领导作用？",
options: ["跟随他人的领导", "发挥领导作用"],
correctAnswer: "跟随他人的领导",
}
],
currentQuestionIndex:0,
selectedOption:'',
score:0,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad() {
// 模拟获取题目
this.getQuestions();
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
},
getQuestions() {
const questions = this.data.questions; // 使用 this.data.questions 而不是重新定义 questions 数组
this.setData({ questions });
},
// 选项改变时触发的函数
radioChange (e) {
this.setData({ selectedOption: e.detail.value });
},
checkAnswer() {
const { questions, currentQuestionIndex, selectedOption, score } = this.data; // 使用解构赋值获取所有需要的变量
if (currentQuestionIndex < questions.length) { // 检查当前问题是否存在
const currentQuestion = questions[currentQuestionIndex];
const Answer = currentQuestion.correctAnswer; // 获取当前问题的答案
if (selectedOption === Answer) { // 检查用户选择的答案是否正确
this.setData({ score: score + 1 }); // 更新分数
}
}
this.nextQuestion(); // 调用 nextQuestion 函数来更新当前问题索引并检查分数是否达到3分
},
nextQuestion() { // 定义 nextQuestion 函数来更新当前问题索引并检查分数是否达到3分
const { currentQuestionIndex, score } = this.data; // 使用解构赋值获取所有需要的变量
if (currentQuestionIndex < this.data.questions.length - 1 && score < 3) { // 检查是否还有问题并且分数未达到3分
this.setData({ currentQuestionIndex: (this.data.currentQuestionIndex + 1) % this.data.questions.length }); // 更新当前问题索引
if (this.data.score >= 3) { // 检查分数是否达到3分
wx.navigateTo({ url: '../pages/pages3' }); // 如果达到3分，则导航到pages3页面
} else { // 否则，继续下一个问题
wx.navigateTo({ url: '../pages/pages4' });
}
}
},
});
wxml.
<view class="container">
<view class="question" wx:for="{{questions}}" wx:key="id" bindtap="radioChange" data-id="{{item.id}}" data-idx="{{idx}}">
{{item.question}}
<radio-group name='answer' bindchange='radioChange' class="options">
<label class="options"><radio value="A" color='purple'/>前者{{item.option.a}}</label>
<label class="options"><radio value="B" color='purple'/>后者{{item.option.b}}</label>
</radio-group>
</view>
<button class="submit-btn" bindtap="checkAnswer"> 点击提交
</button>
</view>
wxss.
.container {
display: flex;
flex-direction: column;
align-items: center;
}
.question {
font-size: 16px;
padding: 10px;
margin-bottom: 10px;
flex-direction:row;
color: darkslateblue;
}
.options{
display: flex;
flex-direction:row;
align-items:center;
padding:10px;
color:black;
}
.submit-btn {
font-size: 16px;
padding: 10px;
background-color: #5e0361c4;
color: white;
margin-top: 20px;
}
