Как установить this.state.isLoading boolean в false внутри параметров навигации (params) - PullRequest
0 голосов
/ 03 октября 2019

Здравствуйте, я не понимаю что-то о настройке params в сочетании с state. Это работает, если я хочу поймать usernameValue. Но как мне setState isLoading: False внутри вариантов навигации. Я попробовал это:

componentDidMount = () => {
   const isLoadingState = this.state.isLoading;

    this.props.navigation.setParams({
      isLoadingState : false
    });
}

Тогда внутри navigationOptions

  static navigationOptions = ({ navigation }) => {
    const { params = {} } = navigation.state;

    if (typeof params.usernameValue !== "undefined") {

Я не знаю, что здесь делать, чтобы сделать состояние isLoading ложным, как если быЯ использовал setState({isLoading: false}), params.isLoadingState, возвращает false, но ничего не происходит, экран загрузки остается там

params.isLoadingState;
    }

}

Он вернет false, но не назначен переменной состояния isLoading

   this.state = {
      isLoading: true
    };

Переменная isLoading установлена ​​в значение true. Который показывает загрузочный экран. Когда usernameValue не определено, я хочу, чтобы оно загружалось, и если оно определено, я хочу, чтобы состояние isLoading было ложным, поэтому загрузка исчезает.

Чего мне здесь не хватает? Я знаю, как заставить его работать с тайм-аутом, но это не то, что я хочу. Я хочу, чтобы загрузочный экран срабатывал при usernameValue, который был определен или / и не определен.

Спасибо за ваше время, я ценю это

РЕДАКТИРОВАТЬ ДОБАВЛЕНО componentDidMount

componentDidMount = () => {
    console.log("START");

    const changeLoadingState = isLoadingState =>
      this.setState({ isLoadingState });

    const isLoadingState = this.state.isLoading;

    this.props.navigation.setParams({
      isLoadingState: false,
      changeLoadingState
    });

    this.setState({ visibleModal: "fancyLoading" });
    this.props.navigation.setParams({ removeItemValue: this.removeItemValue });
    this.fetchData();

    this._loadInitialStateSavedUsername().then(savedUsername => {
      console.log("savedUsername: " + savedUsername);
      if (savedUsername !== null) {
        this.setState({
          usernameValue: savedUsername
        });
        this.props.navigation.setParams({ usernameValue: savedUsername });
      }
    });

    this._loadInitialStateFacebookName().then(facebookName => {
      console.log("facebookName: " + facebookName);
      if (facebookName !== null) {
        this.setState({
          facebookName: facebookName
        });
        this.props.navigation.setParams({ facebookName: facebookName });
        this.setState({ visibleModal: "fancyFacebook" });
      }
    });

    this._loadInitialStateFacebookFirstName().then(facebookFirstName => {
      console.log("facebookFirstName: " + facebookFirstName);
      if (facebookFirstName !== null) {
        this.setState({
          facebookFirstName: facebookFirstName
        });
      }
    });

    this._loadInitialStateFacebookEmail().then(facebookEmail => {
      console.log("facebookEmail: " + facebookEmail);
      if (facebookEmail !== null) {
        this.setState({
          facebookEmail: facebookEmail
        });
      }
    });

    this._loadInitialStateFacebookPicture().then(facebookPicture => {
      console.log("facebookPicture: " + facebookPicture);
      if (facebookPicture !== null) {
        this.setState({
          facebookPicture: facebookPicture
        });
      }
    });

    Animated.timing(
      // Animate over time
      this.state.fadeAnim, // The animated value to drive
      {
        toValue: 1, // Animate to opacity: 1 (opaque)
        duration: 2000 // 2000ms
      }
    ).start(); // Starts the animation
  };

1 Ответ

0 голосов
/ 03 октября 2019

Вы можете передать функцию при добавлении параметра в navigation, оттуда вы можете использовать эту функцию для изменения состояния.

componentDidMount = () => {
  const changeLoadingState = (isLoading) => this.setState({isLoading});

  const isLoadingState = this.state.isLoading;

  this.props.navigation.setParams({
    isLoadingState : false,
    changeLoadingState
  });
}

А потом позже вы можете вызвать эту функцию позже, когда usernameValue меняется следующим образом:

const { params = {} } = navigation.state;

if (typeof params.usernameValue !== "undefined") {
  navigation.state.params.changeLoadingState(false);
} else {
  navigation.state.params.changeLoadingState(true);
}

Надеюсь, это ответит на ваш вопрос.

...