微信小程序实现随机答题时，点击下一题应该如何使他随机展示出来

Question

问题描述

我在实现时，需要点击下一题然后随机获取一道题并在本页面不动，只需要变换获取到的值，应该怎么实现

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

<view class="content" wx:for-index="index" wx:for="{{questionList}}">
    <view class="content-title">
      {{item.questionTitle}}
    </view>
    <view class="content-questionA {{key==index ? 'content-questionA-select' : 'content-questionA' }}" wx:for="{{item.questions}}" wx:for-index="index" wx:for-item="items" bindtap='selectAnswer' data-index='{{index}}'>
      <text class="question-select {{key==index ? 'question-select' : 'question-no-select' }}">{{items.questionSelect}}</text>{{items.question}}
      <image wx:if="{{!showView && key==index && item.answer != items.questionSelect }}" src="../../resource/imgs/cancel.png" class="question-cancel"></image>
      <image wx:if="{{!showView && key==index && item.answer == items.questionSelect }}" src="../../resource/imgs/srue.png" class="question-cancel"></image>
    </view>
    <view class="answer-analysis" wx:if="{{!showView}}">
      <view class="answer-select">正确答案：{{item.answer}}</view>
      <view class="answer-analysis-centent">{{item.answerAnalysis}}</view>
    </view>
    <view class="select-button">
      <button class="submite" wx:if="{{showView}}" bindtap="srue">确定</button>
      <button class="next-question" wx:else bindtap="nextQuestion">下一题</button>
    </view>
  </view>
  
  data:{
  isSelect: false,
questionList: [{
      id: "",
      questionTitle: "俗称“四不像”的动物是",
      questions: [{
          question: "麋鹿",
          questionSelect: "A",
        },
        {
          question: "羚羊",
          questionSelect: "B",
        },
        {
          question: "骡子",
          questionSelect: "C",
        },
        {
          question: "以上都不是",
          questionSelect: "D",
        },
      ],
      answer: "A",
      answerAnalysis: "俗称“四不像”的动物是麋鹿dfsdf会觉得合适机会的话都是当地时间"
      // questionA:"麋鹿",
      // questionB:"羚羊",
      // questionC:"骡子",
      // questionD:"以上都不是",
    },
    {
      id: "",
      questionTitle: "我国的国宝动物是",
      questions: [{
          question: "金丝猴",
          questionSelect: "A",
        },
        {
          question: "丹顶鹤",
          questionSelect: "B",
        },
        {
          question: "熊猫",
          questionSelect: "C",
        },
        {
          question: "以上都不是",
          questionSelect: "D",
        },
      ],
      answer: "C",
      answerAnalysis: "熊猫是我国宝，深受全世界人的喜爱"
      // questionA:"麋鹿",
      // questionB:"羚羊",
      // questionC:"骡子",
      // questionD:"以上都不是",
    }
  ]
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    id: parseInt(options.id)
  },

  selectAnswer: function(e) {
    this.isSelect = true;
    this.setData({
      key: e.target.dataset.index
    })
  },
srue: function(e) {
let that = this;
// this.flag = true;
// this.flag = true;
if (this.isSelect == true) {
  // debugger
  this.setData({
    showView: !that.data.showView
  })
} else {
  this.showView = true;
  wx.showModal({
    title: '提示',
    content: '请选择答案',
    success(res) {
      if (res.confirm) {
        console.log('用户点击确定')
      } else if (res.cancel) {
        console.log('用户点击取消')
      }
    }
  })
}
},
nextQuestion: function() {
var that = this;
if (that.data.id < that.data.questionList.length - 1) {
  this.setData({
    id: that.data.id + 1
  });
};
console.log(that.data.questionList.length,'jdffhjfhdhh')

},

你期待的结果是什么？实际看到的错误信息又是什么？

Answer 1

思路就是去一个不重复的随机数咯。
比如：题库有 n 道题，那就是从 [0, 1, 2, 3, 4 ..., (n-1)]中随机抽取一个索引，并根据这个索引控制显示问题，随机数一次次取就太傻了，来一个乱序算法，把以上数组乱序（最简单的就比如 array.sort(() => return Math.random > .5 ? -1 : 1 ) ）后，按照那个乱序后的数组逐个取索引显示问题咯