React Constructor, вызываемый дважды (для компонента с FirestoreConnect HO C) - PullRequest
0 голосов
/ 24 апреля 2020
  class LocationEntryScreen extends React.Component {
  constructor(props) {
    super(props);
    console.log("LocationEntryScreen >> constructor ");  
    this.state = {
      location_entry: {...this.props.location_entry}
    }
  }

  render() {      
    console.log("LocationEntryScreen >> render");

    return (
          <View><Text>{this.state.location_entry.block}</Text></View>          
    );      
  }

  componentDidUpdate() {
    console.log("locationEntryScreen >> componentDidUpdate");
  }

  componentDidMount() {
    console.log("locationEntryScreen >> componentDidMount");
  }
}

export const LocationEntryScreenContainer = compose(
  firestoreConnect((props) => {
    console.log("locationEntryScreen >> firestoreConnect >> ");
    return ([
    { 
      collection: "projects", doc: PROJECT_NAME, storeAs: "location_entry", 
      subcollections: [
          { collection: "sheets", doc: props.route.params.sheet_name },
          { collection: "location_entries", doc: props.route.params.location_entry_id },
      ] 
    },  
  ]);}),
  connect((state, props) => {
    console.log("locationEntryScreen >> connect >> ");
    return ({    
    location_entry: {
      id: props.route.params.location_entry_id,
      ...state.firestore.data["location_entry"],
    }
  });
  })
  )(LocationEntryScreen);

Выше приведен компонент класса, который использует библиотеку реагировать-избыточно-огненную базу и ведет к восстановлению . Он реализует метод HO C для синхронизации c компонента данных моего пожарного хранилища.

При переходе к этому экрану из предыдущего компонента:

    buttonPressHandlerUpdateLocationEntry(sheet_name, location_entry_id) {
    console.log("buttonPressHandlerUpdateLocationEntry >> " + sheet_name + " >> " + location_entry_id);
    this.props.navigation.navigate("LocationEntryScreen", 
    {
        "sheet_name": sheet_name,            
        "location_entry_id": location_entry_id,      
    });                                      
};

connect вызывается три раза, а firstoreConnect вызывается только во втором раунде. Я копирую данные из реквизита в состояние в конструкторе. Это приводит к тому, что компонент, имеющий данные в предыдущем элементе, перемещается на.

[Fri Apr 24 2020 11:18:14.161]  LOG      buttonPressHandlerUpdateLocationEntry >> Internal Finishes >> IQDjvUTg0C0iw0DJK5Vp
[Fri Apr 24 2020 11:18:14.203]  LOG      locationEntryScreen >> connect >>
[Fri Apr 24 2020 11:18:14.204]  LOG      LocationEntryScreen >> constructor
[Fri Apr 24 2020 11:18:14.205]  LOG      LocationEntryScreen >> render
[Fri Apr 24 2020 11:18:14.246]  LOG      locationEntryScreen >> componentDidMount
[Fri Apr 24 2020 11:18:14.247]  LOG      locationEntryScreen >> firestoreConnect >>
[Fri Apr 24 2020 11:18:14.248]  LOG      locationEntryScreen >> connect >>
[Fri Apr 24 2020 11:18:14.248]  LOG      LocationEntryScreen >> render
[Fri Apr 24 2020 11:18:14.248]  LOG      locationEntryScreen >> componentDidUpdate
[Fri Apr 24 2020 11:18:14.248]  LOG      locationEntryScreen >> connect >>
[Fri Apr 24 2020 11:18:14.249]  LOG      LocationEntryScreen >> render
[Fri Apr 24 2020 11:18:14.249]  LOG      locationEntryScreen >> componentDidUpdate

Это ожидаемое поведение? Я правильно использую firestoreConnect ?

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