this.state в функции вызова конструктора синхронно

Question

Итак, у меня есть следующее ...

constructor(props) {
    super(props);
    this.props.getCurrentProfile();
         this.state = {
              city:
                this.props.profile.location.city !== ""
                  ? this.props.profile.location.city
                  : "",
              country: "",
              zipcode: "",
    ...

Эти свойства зависят от this.props.getCurrentProfile().Есть ли способ выполнить this.state после getCurrentProfile, поскольку это происходит асинхронно?Также я знаю, что условный рендеринг для

this.props.profile.location.city !== ""
          ? this.props.profile.location.city
          : "",

, вероятно, не сработает. Я просто хотел посмотреть, работает ли он.Вместо этого я знаю, чем заняться, просто хотел попробовать.Но мне нужно загрузить свой профиль, чтобы сначала его проверить.Потому что это возвращается как неопределенное, так как оно устанавливает состояние до того, как Redux загрузится в новом состоянии.

Answer 1

Поскольку componentWillReceiveProps устарела, я бы порекомендовал вам использовать static getDerivedStateFromProps.

Я бы порекомендовал вам сравнить два объекта перед выполнением setState в getDerivedStateFromProps.Если оба объекта не равны, тогда делайте setState, иначе вы попадете в бесконечное предупреждение цикла setState.Вы должны всегда сравнивать текущие реквизиты с предыдущими реквизитами, и если они не равны только тогда, делайте setState.Поэтому для сравнения двух объектов я бы порекомендовал вам использовать модуль подчеркивания для глубокой проверки равенства.Пожалуйста, проверьте мой обновленный ответ ниже

constructor(props) {
  super(props);
  this.props.getCurrentProfile();

  this.state = {
          city: "",
          country: "",
          zipcode: "",
  }

  static getDerivedStateFromProps(nextProps, prevState) {
    if(!_.isEqual(this.props.profile, nextProps.profile)) {
      return ({ city: nextProps.profile.location.city }) // <- this is setState equivalent
    }
    return null;
  }

Answer 2

constructor(props) {
  super(props);
  this.props.getCurrentProfile();

  this.state = {
          city: "",
          country: "",
          zipcode: "",
  }

  componentWillReceiveProps(nextProps) {
    if(nextProps.profile) {
      this.setState({ city: nextProps.profile.location.city })
    }
  }

После того, как действие getCurrentProfile вызвано и возвращено значение, componentWillReceiveProps будет получать новые реквизиты profile, следовательно, setState в componentWillReceiveProps