Возврат переменной из axios.get?

Question

[albertalexandrov]

Всем привет!)

Есть код https://codepen.io/anon/pen/xQwVdZ. Сейчас при первом клике ip в консоль не выводится. Только при втором. Как это исправить?

Answer 1

[0xD34F]

getMyIP() {    
  return axios.get('https://httpbin.org/get').then(response => response.data.origin)
}
  
handleClick() {
  this.getMyIP().then(ip => console.log(`ip: ${ip}`))
}

Answer 2

[Ilya]

Код выполняется не в том порядке в котором вы его ожидаете.

var IP = 'IP еще не определен'

class App extends React.Component {
  constructor(props) {
    super(props)
        
    this.getMyIP = this.getMyIP.bind(this)
    this.handleClick = this.handleClick.bind(this)
  }
  
  async getMyIP() {    
    console.log('1. Вошли в функцию getMyIP()')
    const response = await axios.get('https://httpbin.org/get')
    console.log('2. Обрабатываем результаты запроса')
    IP = response.data.origin
    console.log('3. Возвращаем значение')
    return IP
  }
  
  async handleClick(e) {
    let ip = await this.getMyIP()
    console.log('4. IP определен:', ip)
  }
  
  render() {

    return (
      <div>
        <input type='button' value='click' onClick={this.handleClick}/>
      </div>
    )
  }
}

ReactDOM.render(
  <App />,
  document.getElementById('root')
);

Comments

[albertalexandrov]

В строке let ip = await this.getMyIP() я не поставил await :( Спасибо!)