Запрос Axios по нажатию кнопки

Question

Почему эта функция не удаляет тест из базы данных, когда она работает с почтальоном?

 deleteQuiz = () => {
    const quiz = this.state.quizData._id
     axios.delete(`http://localhost:5000/${quiz}`) 
    .then(res => {
      console.log(res.data)

  })

с помощью onClick:

<button onClick={() => this.deleteQuiz(this.state.quizData._id)}>Delete Quiz </button>

Аналогично, это не работает:

topicSearch = topic => {
    axios.get(`http://localhost:5000/search/${topic}`)
        .then(res => {
            const data = res.data;
            this.setState({
                quizSelection: data
            })
        })
     }
}

с onClick внутри дочернего компонента, передаваемого в topicSearch

 onClick={this.props.topicSearch}

Но РАБОТАЕТ при вызове topicSearch () внутри onChangeHandler и передаче в e.target.value

handleTopicChange = eventValue => {
    this.topicSearch(eventValue)
    this.setState({
        topic: topic
    })
}

Из других примеров кажется, что передача состояния в функции приемлема - это что-то очевидное, чего мне не хватает?

Answer 1

Вы не получаете никаких параметров здесь:

deleteQuiz = () => {
  const quiz = this.state.quizData._id;
  axios.delete(`http://localhost:5000/${quiz}`).then(res => {
    console.log(res.data);
  });
};

Поэтому используйте такой параметр:

deleteQuiz = quiz => {
  axios.delete(`http://localhost:5000/${quiz}`).then(res => {
    console.log(res.data);
  });
};

И это будет использовать переданный параметр, а не параметр из состояния.

<button onClick={() => this.deleteQuiz(this.state.quizData._id)}> Delete Quiz </button>