Компонент Event продолжает вызывать componentDidMount, но никогда не загружается вообще - PullRequest
0 голосов
/ 20 сентября 2019

В моем приложении react native 0.59 есть 3 нижние вкладки с react navigation 3.7.Вкладки Event, Group и Contact.Event - это начальная вкладка.

enter image description here

После начальной загрузки я нажимаю вкладку Group, и на экране отображается следующее:

enter image description here

Показаны 2 группы HT и MKL.После того, как я щелкну одну группу, либо HT, либо MKL, она должна загрузить компонент EventПроблема в том, что после нажатия на группу Event никогда не загружается.На экране мониторинга приложений и серверов происходит сумасшедшая загрузка Event и Group без остановок.Экран застрял на Group и перестает реагировать на любой щелчок.Я не имею ни малейшего представления об этом поведении, так как модуль Event был полностью протестирован, а Group был добавлен заново.

Вот код onPress в Group модуле:

async _onPress(id) {
  try {
    console.log("saved group id in Group : ", id);
    await helper.setMyValue("group_id", id.toString());
    //update group_id in App.js
    this.props.updateGroup(id);  //<<<===this causes the problem
  } catch (err) {
    console.log("error in saving group_id to local disk", err);
  };
  this.props.navigation.goBack();
  //this.props.navigation.navigate("Event"); //, {group_id:element1.id});
}

То, что делает вышеупомянутый onPress, - это сохранение пользователя id, на которого нажали, и вызов updateGroup для обновления group_id родителя.и вызовите goBack, который является Event компонентом.

* componentDidMount в Event:

async componentDidMount(){
      this._isMounted = true;

      if (!this.props.group_id) {
        alert("Select a group");
        return;
      };
      try {
        //retrieving token
        let result = this.state.token;
        if (!result) {
          result = await helper.getJwtToken();
           if (this._isMounted) this.setState({
             token: result
           });  
        };

        //console.log("secure store : ", result);
        if (!result) {
          this.props.navigation.navigate("Signup");
          return;
        };

        this.refreshData(result);

        //refresh data after goBack()
        this.willFocusSubscription = this.props.navigation.addListener(
          'willFocus', () => {
            this.refreshData(result);
          }
        );

        //get user
        let myself = this.state.user;
        if (!myself)  {
          myself = await helper._getUser(result.password, result.username);
          if (this._isMounted) this.setState({
             user: myself
           });  
        };

        console.log("out of did mount event", this.state);
      }
      catch (err) {
        console.log("服务器错误(et),请再试一次!", err);
        this.props.navigation.navigate.goBack(); //("Event");
        return;

      };

Вот вывод консоли приложения в Event componentDidMount:

09-19 20:16:44.551 21659 21743 I ReactNativeJS: 'event url : ', 'http://192.168.2.133:3000/api/events/active?group_id=1&_group_id=1&_device_id=0cfce7b7e86fa397&_timezone=America%2FLos_Angeles'
09-19 20:16:44.552 21659 21743 I ReactNativeJS: 'out of did mount event', { activeEvents: [],

    }

UPDATE:

Проблема вызвана this.updateGroup(id), который обновляет состояние group_id в App.js

updateGroup = (group_id) => {
    if (this._isMounted) this.setState({group_id:group_id});
  };

Он передается в Group в качестве реквизита в App.js:

const GroupWithSelf = (props) => (<Group {...props} myself={data.myself} token={data.result} updateGroup={this.updateGroup} updateToken={this.updateToken} />);

Не уверен, почему этот метод вызывает гонки.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...