Необработанное отклонение (ошибка типа): это не определено — функция обратного вызова axios

#reactjs #callback

#reactjs #обратный вызов

Вопрос:

Utils.js

Это моя функция для обработки запросов, и я хочу обработать ответ с обратным вызовом.

  static Request(data, callback) {

        const method = data[0] || "";
        const url = data[1] || "";
        const param = data[2] || "";
        const headers = data[3] || "";

        if (method.toLowerCase() === 'post') {
            var data = {
                url: url,
                method: method.toLowerCase(),
                contentType: 'application/json',
                data: {
                    param
                }
            };

            if (headers) {
                data.headers = {
                    headers
                };
            }

            axios(data).then(function (response) {
                console.log(response);
            })
                .catch(function (e) {
                    console.log(e);
                });
        } else if (method.toLowerCase() === 'get') {
            axios.get(url)
                .then((response) => {
                    // console.log(response.data);
                    callback(response.data);
                    return (response.data);
                })
        } else {
            console.log("Undefined");
        }
    }
  

Вот как я пытаюсь получить ответ от обратного вызова. (другой файл)

 handleClick() {
    Utils.Request(['get', 'www.URL.com'],
      function Response(data) {
        this.state({ response: data.msg })
      })
  }
  

Затем в кнопке

   button onClick={this.handleClick()}>Teste</button
  

Ошибка, которую я получаю, — необработанное отклонение (ошибка типа): это не определено

Что я делаю не так?

Здесь полный компонент. Это новый свежий компонент..

 export default class Discover extends Component {
  constructor(props) {
    super(props);

    this.state = { itemArray: [], response: null };

    this.handleClick = this.handleClick.bind(this);
  }


  handleClick() {
    Utils.Request(['get', 'url'],
      function Response(data) {
        this.setState({ response: data.msg })
      })
  }

  render() {

    return <React.Fragment>
      <button onClick={() => { console.log(this.state.response) }}>Click</button>
      <button onClick={() => this.handleClick()}>Teste</button>

    </React.Fragment>;
  }
}
  

Комментарии:

1. похоже, ошибка исходит из вашего файла компонента. вы можете это проверить? где именно вы получаете эту ошибку?

2. Ошибка исходит от: this.state({ ответ: data.msg }) @MohammadFaisal

3. Response также необходимо привязать this или изменить на функцию со стрелкой.

4. Хорошо, я понял, спасибо, Брайан!!!

5. (data) => { this.setState({ response: data.msg }) })