Реагируйте: Обновление контекста при втором клике - PullRequest
1 голос
/ 28 января 2020

Я сталкиваюсь с небольшой проблемой в моем сценарии реакции, когда пытаюсь обновить контекст.

У меня есть кнопка, которая при нажатии на нее предполагает обновление контекста, но она работает только при втором нажатии:

enter image description here Вот код моего компонента:

    import React, { useContext } from 'react'
    import axios from 'axios'
    import { MdDelete } from 'react-icons/md'
    import AppContext from '../../../../../../../context/AppContext'


    const DeleteAttribute = (props) => {
      const context = useContext(AppContext)

      const handleClick = () => {
          context.app.insertApiResponse('test')

          console.log(context.app.lastApiResponse)
      }

      return (
          <div className="item skr-flex row centered-v" onClick={ handleClick }>
              <MdDelete className="skr-icon delete mr-s"/>
              <span className="font-700">Supprimer</span>
          </div>
      )
    }
    export default DeleteAttribute

Я также пытался использовать Appcontext.Consumer, но появляется тот же результат.

Я не понимаю, почему это работает только при втором нажатии на кнопку, и мне было бы очень полезно, если бы кто-то мог дать мне ответ.

Заранее спасибо!

1 Ответ

1 голос
/ 28 января 2020

Проблема в том, что вы пытаетесь получить доступ к значению до того, как API ответит какими-либо данными. На втором запуске данные в context.app.lastApiResponse имеют значение с первого запуска. Так что вам нужно использовать then(), это ждет данных и затем выполняет код внутри

Не совсем точно, как выглядит ваш другой код, но вы можете попробовать что-то вроде этого:

const DeleteAttribute = (props) => {
  const context = useContext(AppContext)

  const handleClick = () => {
      context.app.insertApiResponse('test').then(() => {
    console.log(context.app.lastApiResponse)
  })   
}
...