Почему this.props.Func возращает undefined?

Question

[nano_e_t_4]

Всем привет
У меня есть функция, который делает пост запрос и по идее должен возвращать в ответе статус код

someAwesomeFunction= (arg1) => {
        let data = JSON.stringify({
            "arg1": arg1,
        })
        // Send a POST request
        axios({
            method: 'post',
            url: awesomeUrl,
            data: data,
            headers: {
                "Content-Type": "application/json"
            }
        }).then((response) => {
            console.log(response.status)       ##вот здесь печатает статус код
            return (response.status)
        })
            .catch((error) => {
                console.log(error)
                return 500
            })}

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

когда я ее вызываю из компонента, он норм отрабатывает и сервер делает свою часть работы

но когда я пробую прочитать ответ, то получаю undefined

handleClick = () => {
        let response = this.props.someAwesomeFunction(this.props.arg)
        console.log(response)           ######вот здесь получаю undefined
    }
    render() {
        return <button
            className={this.props.isActive ? 'active' : 'album'}
            onClick={this.handleClick} > {this.props.someAwesomeArg}
        </button>
    }
}

Answer 1

[Mikhail Osher]

Добавьте return statement перед вызовом axios.

someAwesomeFunction= (arg1) => {
        let data = JSON.stringify({
            "arg1": arg1,
        })
        // Send a POST request
        return axios({
            method: 'post',
            url: awesomeUrl,
            data: data,
            headers: {
                "Content-Type": "application/json"
            }
        }).then((response) => {
            console.log(response.status)       ##вот здесь печатает статус код
            return (response.status)
        })
            .catch((error) => {
                console.log(error)
                return 500
            })}

Затем дождитесь асинхронную операцию

// вариант 1
handleClick = async () => {
        let response = await this.props.someAwesomeFunction(this.props.arg)
        console.log(response)           ######вот здесь получаю undefined
    }

// вариант 2
handleClick = () => {
        this.props.someAwesomeFunction(this.props.arg).then(response => {
             console.log(response);
        });
    }

А вообще, советую внимательно прочитать и понять https://learn.javascript.ru/async

Comments

[nano_e_t_4]

спасибо, попробую

[nano_e_t_4]

помоголо, еще раз спасибо