kelwin27

Всем большое спасибо за ответы!
Ошибка была не там, где я думал. Уважаемый Kentavr16 правильно заметил на лишний элемент в декомпозиции, а именно упорядочивание результатов запроса. Я избавился от этого компонента. Get запрос на АПИ переписал как метод класса, а сам запрос обернул в async/await:

export default class RouteQuestions {
    static async getAll (){

        const response = await axios.get("https://opentdb.com/api.php?amount=5&category=17&difficulty=easy&type=multiple")

        const preQuestions = response.data.results
        const newQuestions = []
    
        for (let i = 0; i < preQuestions.length; i++) {
    
        const answ = [...preQuestions[i].incorrect_answers, preQuestions[i].correct_answer]
        const answers = []
    
        for (let i = 0; i < answ.length; i++){
            
            answers.push({
                value: answ[i],
                id: nanoid(),
                isHold: false
            })
        }
            newQuestions.push({
                answer: preQuestions[i].correct_answer,
                id: nanoid(),
                text: preQuestions[i].question,
                answers: answers
            })}
            return newQuestions
        }
    }

Обращение к данному методу обернул в useEffect и добился необходимой функциональности:

const [questions, setQuestions] = React.useState([])

    React.useEffect( () => { 
        async function fetchQuestions() {
            const questions = await RouteQuestions.getAll()
            setQuestions(questions)
        }
        fetchQuestions()
    }, [])

Буду очень благодарен, если кто-нибудь объяснит, почему код начал работать, заранее благодарен за ваше потраченное время.