Обновить контекст в зависимости от ответа ax ios - PullRequest
Новая
       6

Обновить контекст в зависимости от ответа ax ios

1 голос
/ 29 мая 2020

У меня проблема,

Необработанное отклонение (ошибка): недопустимый вызов ловушки.

Очевидно, это нарушает правило «Не звонить в случае обработчики ". ? Я не могу найти альтернативу обновлению своего контекста. Мне нужен контекст, чтобы обновить несколько компонентов, например меню . js, чтобы управлять доступом к частным маршрутам ...

My AuthContext. js 

export const AuthContext = React.createContext({
    token: localStorage.getItem('token') || '',
    setToken: () => {}
});

My LoginForm. js

class LoginForm extends Component {
  authContext = useContext(AuthContext);

  constructor() {
    super();
    this.state = {
      email: 'eve.holt@reqres.in',
      password: 'cityslicka',
      error: ''
    };

    this.handlePasswordChange = this.handlePasswordChange.bind(this);
    this.handleEmailChange = this.handleEmailChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleSubmit(evt) {
    evt.preventDefault();
    axios({
      method: 'POST',
      url: 'https://reqres.in/api/login',
      data: {
        email: this.state.email,
        password: this.state.password
      }
    }).then(result => {
      if (result.status === 200) {
        this.authContext.setToken(result.data.token);
        localStorage.setItem('token', result.data.token);
      } else { }
    });
  }

 ...
}

Я нашел несколько ответов, но Я не могу понять или решить моя проблема. Если вы можете объяснить свои ответы, я буду признателен

Спасибо за помощь

1 Ответ

1 голос
/ 29 мая 2020

Вам необходимо переписать свой классический компонент в функциональный компонент, поскольку хуки не предназначены для работы внутри классов. Ознакомьтесь с правилом хуков react do c: https://reactjs.org/docs/hooks-rules.html#only -call-hooks-from-react-functions

...