Как сделать так, чтобы сообщение об ошибке отображалось: нет и отображалось: блок?

Question

У меня есть метод, который не определяет ShowErrorWarning в области рендеринга. Мне нужно использовать государство. Но как я могу получить эту функцию действительной?

Я уже пытался использовать сообщение об ошибке как функцию ShowErrorMessage над классом. Но тогда я не могу включить состояние.

function ShowWarning() {

let error = this.props.warningError.error;   

    if (error === "") {
        this.setState({
            ...this.state,
            errorStyle: {
                display: 'none'
            },
            warningMessage: ''
        });
    } else {
        this.setState({
            ...this.state,
            errorStyle: {
                display: 'block'
            },
            warningMessage: this.props.warningError.message
        }); 
    }

}

Сообщение об ошибке будет отображаться как отдельный компонент, когда я получаю сообщение об ошибке вызова API. Это хранится в this.props.warningError.error.

Answer 1

Вы должны иметь возможность использовать простой троичный оператор в вашем JSX и либо визуализировать необходимый компонент, либо null на основе warningError.error, содержащей сообщение.

render() {
  const { warningError } = this.props;

  return (
    <div>
      {warningError.error !== '' ? <ErrorComponent message={warningError.message} /> : null}
    </div>
  );
}