Получить дочернее композитное состояние внутри ErrorBoundary для componentDidCatch React JS - PullRequest
Новая
       6

Получить дочернее композитное состояние внутри ErrorBoundary для componentDidCatch React JS

0 голосов
/ 27 апреля 2020

Я пытаюсь реализовать ErrorBoundary, следуя документам и до сих пор успешно.

Я использовал тот же подход, упомянутый в документах 

<ErrorBoundary>
  <MyWidget />
</ErrorBoundary>

Что я не могу сделать sh, так это получить состояние дочернего компонента MyWidget внутри ErrorBoundary в функции componentDidCatch ErrorBoundary. Я хочу отправить состояние дочернего компонента вместе с ошибкой на сервер, чтобы было легче отлаживать.

Пока я пробовал использовать refs, например 

<ErrorBoundary childrenRef={this.refs["myWidget"]}>
   <MyWidget ref="myWidget"/>
</ErrorBoundary>

И затем в моем дочернем компоненте я создал функцию getState, которая просто возвращает собственное состояние, а затем внутри ErrorBoundary я получаю состояние дочернего компонента, используя предоставленный ref как 

render() {
    if (this.props.childrenRef) {
      console.log(this.props.childrenRef.decoratedRef.current.getState());
    }
    if (this.state.errorInfo) {
      // Error path
      console.log(this.state.errorInfo);
      return (
        <div>
          <h2>Something went wrong.</h2>
          <details style={{ whiteSpace: 'pre-wrap' }}>
            {this.state.error && this.state.error.toString()}
            <br />
            {this.state.errorInfo.componentStack}
          </details>
        </div>
      );
    }
    // Normally, just render children
    return this.props.children;
  }

, который выполняет работу и возвращает состояние дочернего компонента, но когда я пытаюсь использовать тот же код получения состояния с использованием ссылок внутри componentDidCatch, тогда это this.props.childrenRef.decoratedRef.current приводит к null, возможно, потому что Дочерний компонент имел ошибку и размонтирован, поэтому current становится null, который ранее имел ссылку на сам дочерний компонент.

Есть ли лучший способ выполнить sh это? Я что-то не так делаю?

...