przekazywane id jest undefined przez co nie moge użyc metody delete

0

Chciałbym usuwać swoje zagadki po udzieleniu odpowiedzi przez zalogoweanego użytkownika, problem jest z przekazaniem id który jest undefined przez co nie moge usunac tej zagadki bo mam komunikat z konsoli:
Error: DELETE http: // api / Remove / undefined 400 (Bad Request)
Oto fragment mojego kodu :

state={
qBank:[{id:1,question:'dd',answers:['a','b','c','d'],correct:'a'}]
}

render:

 this.state.qBank.map(
                                ({ question, answers, correct, id }) => (
                                    <QuestionBox key={id} id={id} question={question} options={answers} selected={answer => this.computeAnswer(answer, correct)} />
                                )
                            )}

questionBox:

const QuestionBox = ({ question, options, selected, key, id }) => {
    const [answer, setAnswer] = useState(options);
    const [alreadyAnswered, setAlreadyAnswered] = useState(false);
    return (
        <div className="questionBox">
            <div className="question">{question}</div>
            {(answer || []).map((text, index) => (
                <button disabled={alreadyAnswered} key={index} className="answerBtn" onClick={(id) => {
                    if (!alreadyAnswered) {
                        setAnswer([text]);
                        selected(text);
                        setAlreadyAnswered(true);
                        fetch("http:/api/Remove/" + id, {
                            method: 'DELETE',
                            headers: {
                                "Content-Type": "application/json",
                                "Authorization": `bearer ${sessionStorage.getItem("access_token")}`
                            },
                        }).then(() => {
                        }).catch(err => {
                            console.error(err)
                        })
                    }
                }}>{text}</button>
            ))}
        </div>
    )
}
0

Na szybko - możesz przechować id jako state, razem z obiektem answers, a przy requeście użyć id ze stanu.

0

sprawdziłem jeszcze react developers tools czy przekazuje sie id i jest ok, czyli musze cos robic zle w komponencie funkcyjnym tylko nie wiem co.. Jakbyś mial troszke wiecej czasu pomógłbys mi to ogarnąc? Bo jak na razie Twoj pomysłpewnie jest ok, ale nie za bardzo rozumiem o co chodzi
https://zapodaj.net/625b1c6cd90e6.png.html

1

Dopiero teraz zauważyłem co jest nie tak :) Zaciemniasz zmienną id w handlerze onClick={(id) => {.. W funkcji podpiętej pod onClick powinieneś przyjmować event, nie zmienną przekazaną jako props do komponentu.

1 użytkowników online, w tym zalogowanych: 0, gości: 1