React setState error -> Объекты недопустимы как дочерний элемент React

Question

Я продолжаю получать следующую ошибку

Объекты недопустимы как дочерние элементы React (найдено: объект с ключами {questionId, answer}). Если вы намеревались визуализировать коллекцию дочерних элементов, используйте вместо этого массив.

Я понимаю, что это довольно распространенная ошибка, но я не могу понять это. Любая помощь или указатели в правильном направлении будут великолепны.

const [currentQuestion, setCurrentQuestion] = useState(0)    
const [selectedAnswer, setAnswer] = useState('')
const [savedAnswers, setSavedAnswers] = useState([])

const question = questions[currentQuestion]

const handleNextQuestion = () => {
    if(currentQuestion < questions.length - 1) {

        //create answer array item
        const answer = {questionId: question, answer: selectedAnswer};

        //add saved answer to array
        setSavedAnswers(savedAnswers => [...savedAnswers, answer])

        //go to next question
        setCurrentQuestion(currentQuestion + 1)

        //clear next answer
        setAnswer('')
    }
}
return (
    <div className="section">
        <div className="container">
            <div className={styles.surveyContainer}>
                <h2 className="title is-2 has-text-centered">Feel</h2>

                <Progress 
                    total = {questions.length}
                    current = {currentQuestion + 1}
                />
                <Question 
                    question = {question.question}
                />
                <Answers
                    answers = {question}
                    selected = {selectedAnswer}
                    handleClick = {handleClick}
                />
            </div>
            <button className="button is-primary" onClick={handleNextQuestion}>Next</button>

            {selectedAnswer}Selected Answers
            {savedAnswers}Saved Answers
        </div>
    </div>
)

Answer 1

Вам необходимо отобразить массив ответов. Используйте questionId для клавиши реакции.

savedAnswers.map(({ questionId, answer }) => (
  <div key={questionId}>{answer}</div>
));

Answer 2

const [currentQuestion, setCurrentQuestion] = useState (0]) также определяют это