getDerivedStateFromProps возвратил неопределенный

Question

В настоящее время впервые используем getDerivedStateFromProps.Мой код работает, и он делает то, что я хочу, но в консоли я получаю предупреждение, которое сбивает меня с толку, так как мой код работает.Предупреждение: «getDerivedStateFromProps (): должен быть возвращен действительный объект состояния (или ноль). Вы вернули undefined.»Есть ли лучший способ написания getDerivedStateFromProps для того, чтобы избавиться от предупреждения в консоли?

static getDerivedStateFromProps(props, state) {
 state.currentUser.id =
   props.location.state && props.location.state.user
     ? props.location.state.user.id
     : state.currentUser.id;
 state.currentUser.name =
   props.location.state && props.location.state.user
     ? props.location.state.user.name
     : state.currentUser.name;
 state.currentUser.roles =
   props.location.state && props.location.state.user
     ? props.location.state.user.roles
     : state.currentUser.roles;
 state.currentUser.hasAuthenticated = true;
}

Answer 1

Метод getDerivedStateFromProps должен возвращать обновленный фрагмент состояния вместо обновления объекта состояния, переданного в качестве аргумента.

return {
  currentUser: {
    ...state.currentUser,
    id: props.location.state && props.location.state.user ? props.location.state.user.id : state.currentUser.id,
    name: props.location.state && props.location.state.user ? props.location.state.user.name : state.currentUser.name,
    roles: props.location.state && props.location.state.user ? props.location.state.user.roles : state.currentUser.roles,
    hasAuthenticated: true;
  }
}

I 'мы добавили ...state.currentUser на случай, если есть другие поля state.currentUser, которые вы хотите сохранить в новом состоянии.

Answer 2

Скорее всего, вам не нужно использовать getDerivedStateFromProps: официальные документы, объясняющие, почему .

Похоже, что вам нужно обновить состояние на основе смены реквизита,в этом случае componentDidUpdate() более подходит, но, похоже, вы реплицируете состояние на основе ваших входящих реквизитов.

Простого доступа к ним внутри вашего рендера должно быть достаточно;они не требуют сложных вычислений.Так же, как фиктивный пример:

render() {
  const { userName, id } = this.props.currentUser;
  const hasAuthenticated = id && userName;

  return (hasAuthenticated)
  ?  <WelcomeMessage />
  :  <Login />
}