Question

setCurrentPage只将对象存储到我的全局存储中的页面对象中。因此，如果我设置它后尝试访问它...似乎有一个延迟，对象是空的。但是如果我在一个按钮中控制了同一个对象，然后点击它......就会填充它。

还有一个我不知道的还原滞后吗？我该怎么做才能让它发挥作用？它弄乱了我的代码...

感谢您的帮助

// initialState.js // my global redux store
playlist: {
  currentPage: {}
}

// someComponent
let tempPage = new Page();
tempPage.controlNode = someAPItoGetControlNode();  //synchronous
this.props.actions.setCurrentPage(tempPage);  //tempPage.controlNode contains object correctly
console.log(this.props.currentPage);  //empty object.  WHY???

// in some function in the same component i call in a button
function seeCurrentPage() {
  console.log(this.props.currentPage);  //works!  
}

// reducer
case types.SET_CURRENT_PAGE: {
  action.pageObj.selected = true;
  return Object.assign({}, state, {currentPage: action.pageObj});
}

// action
export function setCurrentPage(pageObj) {
  return { type: types.SET_CURRENT_PAGE, pageObj: pageObj };
}

Answer 1

信息延迟的原因不是因为redux，而是因为component的异步执行。

// someComponent
let tempPage = new Page();
tempPage.controlNode = someAPItoGetControlNode();  //synchronous
this.props.actions.setCurrentPage(tempPage);  //tempPage.controlNode contains object correctly
console.log(this.props.currentPage);

在上面的代码中，您的组件会触发一个操作，然后在记录this.props.currentPage之后立即触发。但是到那个时候，redux商店不会更新，因此你得到一个较旧的结果

您可以做的是登录componentWillReceiveProps功能，如

componentWillReceiveProps(nectProps) {
     console.log(nextProps.currentPage)
}

Answer 2

更新Redux存储后，您的组件将需要重新渲染。

因此，您只需在console.log或componentWillReceiveProps(nextProps)中撰写componentDidUpdate()，即可从商店访问新数据。

Answer 3

我也碰到了这个。像每个人所说的那样更新道具时，这是一个异步的问题。我通过使用异步等待来解决它。如果您想立即获取更新的道具，则可以执行以下操作：


    async function myFunction () {
      await this.props.actions.setCurrentPage(tempPage);
      console.log(this.props.currentPage); // shows updated props
    }

在此代码中，控制台日志等待异步操作完成，然后获取道具。

Redux州没有马上更新？

3 个答案: