Po kliknieciu w button wywołuje funkcje gameIp pobieram z bazy danych zestaw pytan i odpowiedzi np:
state={
qBank: {
Correct:"Tomek"
Question1:"Jak masz na imie?"
RouteId:1
Answers:["ala","ola","Tomek","jan"]
}
}
Które przyporządkowuje do jakies nazwy "if (id === point.RouteId)"
Problemem jest błąd który wyskakuje w konsoli Uncaught TypeError: Cannot read property 'map' of undefined. Nie potrafię sobie poradzić z tym problem. Prośba do doswiadczonych programistów o zerkniecie gdzie robie błąd?
gameIp(id) {
const newQuestion2 = []
for (const point of this.state.qBank) {
if (id === point.RouteId) {
newQuestion2.push({
question: point.Question1,
answers: [...point.Answers],
correct: point.Correct,
id: point.Id
});
}
}
this.setState({ qBank: newQuestion2 })
}
W metodzie render wyswietlam to:
{this.state.qBank.map(({ question, answers, correct, id }) => (
<QuestionBox key={id} question={question} options={answers} selected={answer => this.computeAnswer(answer, correct)} />
)
)}
QuestionBox wygląda tak:
import React, { useState } from 'react';
const QuestionBox = ({ question, options, selected }) => {
const [answers, setAnswer] = useState(options);
return (
<div className="questionBox">
<div className="question">{question}</div>
{answers.map((text, id) => (
<button key={id} className="answerBtn" onClick={() => {
setAnswer([text]);
selected(text)
}}>{text}</button>
))}
</div>
)
}
export default QuestionBox;