【问题标题】:React redux how to use getState()React redux 如何使用 getState()
【发布时间】:2020-09-15 08:58:49
【问题描述】:

我正在从 Firebase Real-time database 获取数据并将其存储到我的 redux 状态中。如何创建一个在初次调用后获得最新和最新状态的操作?

const getIds = (state) => state.notes.activeNotes;

export const getUserNotes = (currentUserId) => (dispatch, getState) => {
  getFromFirebase(`/Notes/${currentUserId}/`, (response) => {
    var ids = Object.keys(response)
      dispatch(setNoteIds(ids)); //should dispatch ids something like this [1,2,3,4,5]
  })

  const test= getIds(getState());
  console.log(test); //current output []
}

Expected output: [1,2,3,4,5]
Actual output: []

【问题讨论】:

  • 你想要调用 api 来获取最新数据吗?
  • getFromFirebase() 函数填充 ID 的 activeNotes。填充后,我希望能够读取帖子填充状态,因此它不是一个空数组,而是包含从 getFromFirebase() 获取的 Id
  • 看起来getFromFirebase 是异步的,这意味着您可以等待结果然后设置调度,然后再次检索您的状态
  • @tmhao2005 可以举个例子吗?

标签: javascript reactjs redux react-redux redux-thunk


【解决方案1】:

假设函数getFromFirebase返回一个promise,那么你可以将你的方法切换为异步,如下所示:


export const getUserNotes = (currentUserId) => async (dispatch, getState) => {
  // wait the result dispatched
  await getFromFirebase(`/Notes/${currentUserId}/`, (response) => {
    var ids = Object.keys(response)
      dispatch(setNoteIds(ids)); //should dispatch ids something like this [1,2,3,4,5]
  })
  
  const test= getIds(getState());
}

或者如果getFromFirebase 不是一个promise,你可以用一个promise 包裹它:

export const getUserNotes = (currentUserId) => async (dispatch, getState) => {
  // wrap in a promise
  await new Promise(resolve => {
    getFromFirebase(`/Notes/${currentUserId}/`, (response) => {
      var ids = Object.keys(response)
        dispatch(setNoteIds(ids)); //should dispatch ids something like this [1,2,3,4,5]
        resolve();
    })
  })
  
  const test= getIds(getState())
}

【讨论】:

  • 啊,它没有返回一个承诺。第二个解决方案似乎已经完成了这项工作!
猜你喜欢
  • 2018-06-03
  • 1970-01-01
  • 2018-01-31
  • 1970-01-01
  • 1970-01-01
  • 2018-08-17
  • 2021-10-22
  • 2021-10-04
  • 2019-12-02
相关资源
最近更新 更多