组件状态在本机选择器更改时获取旧的redux状态

时间:2019-05-31 21:49:44

标签: react-native redux react-redux

大家好,

我正在从事一个本机反应项目,在那里我有一个选择器来选择一家公司来从中获取数据。 当我单击选择器时,它的行为正常,并且值相应地更改,但是组件状态在每次值更改时都获得先前的还原状态。 例如,如果旧存储的值是“ company”,那么在我的下一次单击中,该值将转换为组件状态,而不是我在选择器中选择的值。

这是我的选择器选择功能:

style={{
  /* ...your Animated.View styles */
  flexDirection: this.props.headerHeight < /* collapse height */ ? 'row' : 'column'
}}

这是我的还原动作:

权限操作:

updateCompany = (id) => {
    try {
      const name = this.getNameFromID(id);
      this.setState({loading: true});
      this.props.saveChosenCompany(this.state.username, { id, name });
      this.props.getPermissions();
      console.log('on change permissions: ', this.state.permissions);
      const cards = this.initCardData(this.props.permissions);
      this.setState({
        permissions: this.props.permissions,
        cards,
        loading: false,
        selectedCompanyID: id,
        selectedCompanyName: name
      });
    } catch (error) {
      console.log("update err: ", error);
    }
  }

和公司行为:

export const getPermissions = () => dispatch => {
    Promise.all([AsyncStorage.getItem("token"),AsyncStorage.getItem("uname")])
      .then(([token, uname]) => {
        AsyncStorage.getItem(`${uname}.companyName`).then((chosenCompanyName) => {
            if(chosenCompanyName){
                fetch(
                  `http://${env.ip}:${env.port}/permissions`,
                  {
                    method: "POST",
                    headers: {
                      "content-type": "application/json",
                      accept: "application/json",
                      Authorization: "Bearer " + token
                    },
                    body: JSON.stringify({
                      company: chosenCompanyName
                    })
                  }
                )
                .then(permissions => permissions.json())
                .then(permissions => {
                    AsyncStorage.setItem(`${uname}.${chosenCompanyName}.permissions`, JSON.stringify(permissions))
                    .then(() => {
                        dispatch({
                          type: GET_PERMISSIONS,
                          payload: permissions
                        });
                    })
                })
                .catch(err => console.log('getPermissions error: ',err));
            }
        });
      })
      .catch(err => console.log('getPermissions error: ',err));
};

export const initPermissions = () => dispatch => {
    AsyncStorage.getItem('uname')
    .then(uname => {
        AsyncStorage.getItem(`${uname}.companyName`)
        .then(company => {
            if(company) {
                AsyncStorage.getItem(`${uname}.${company}.permissions`)
                .then(permissions => JSON.parse(permissions))
                .then(permissions => {
                    dispatch({
                        type: INIT_PERMISSIONS,
                        payload: permissions
                    });
                });
            }
        })
    })
    .catch(err => console.log('initPermissions error: ', err));
}

我希望有人可以向我解释这个问题以及如何解决。 我还应该提到,当从render方法内部登录时,权限属性最终会达到应有的值,但组件状态不会更改,并且组件不会更新。

提前感谢大家的帮助。

0 个答案:

没有答案