I currently have this file English.js

const questions = [
  "what is your name?",
  "How old are you?",
  "Where are you from?",
  "You speak English?",
  "How long have you been speaking English?",
  "What is your favorite color?",
  "What are your hobbies?",
  "What is your first language?",
  "What is your occupation?",
  "Who is your role model?"
]

const englishQuiz = []
const indexing = []
while (indexing.length < 5) {
  let rand = Math.floor(Math.random() * questions.length)
  if (!indexing.includes(rand)) {
    indexing.push(rand)
    englishQuiz.push(questions[rand])
  }

}
console.log(englishQuiz)
export default englishQuiz

In another file Quiz.js, I import the englishQuiz

import  englishQuiz from '../data/English'

After completing the quiz, I pop the stack to go to the previous page. But when I go back to the quiz page again, it is the same questions. I am trying to get these questions reshuffled every time that I go to the quiz page via the random loop I have in the English.js. Any help please

CodePudding user response：

Instead of the doing logic directly export a function that shuffles your questions and return it then use it whenever needed.

const questions = [
  ...
]
 
export const getEnglishQuiz = () => {
  const englishQuiz = []
  const indexing = []
  while (indexing.length < 5) {
    let rand = Math.floor(Math.random() * questions.length)
    if (!indexing.includes(rand)) {
      indexing.push(rand)
      englishQuiz.push(questions[rand])
    }
  }
  return englishQuiz
}

Now in your component you use this function when screen is focused. So whenever your screen focused again you should call this function to get the new questions again.