Question

我对诺言充满信心，我无法解决诺言的问题。从API提取数据后，我必须在loadPosts函数中返回新状态：

[loadPosts]: (state, index) => {

   fetchPosts().then( data => {
      return {
         ...state,
         postState : {
            postList : data.data
         }
      }            
    })
}

这是我的 fetchPosts 函数：

export const fetchPosts = () => {

   console.log("Fetch posts...");
   fetch(process.env.REACT_APP_API_URL + '/post')
   .then(response => response.json())
   .then(data => {
      return data
    })
   .catch(error => console.error(error))

}

我得到“ TypeError：无法读取未定义的属性'then'”

据我了解， fetchPosts 函数的第一个和第二个 then 应该返回一个具有解析值的Promise，但我却不确定。

如果我以这种方式更改获取帖子（添加返回）：

export const fetchPosts = () => {
   console.log("Fetch posts...");
   return fetch(process.env.REACT_APP_API_URL + '/post')
   .then(response => response.json())
   .then(data => {
      return data
   })
  .catch(error => console.error(error))
 }

我收到另一个错误：减速器“ app”返回未定义。要忽略操作，您必须显式返回先前的状态。

我如何使用诺言达成目标？

谢谢

Answer 1

1。）您需要返回fetch()，以便可以链接.then()。

2。）您需要在减速器中使用默认大小写，以返回state。

Answer 2

首先，让我们修复您的fetchPosts函数

export const fetchPosts = () => {
   console.log("Fetch posts...");
   return fetch(process.env.REACT_APP_API_URL + '/post')
   .then(response => response.json())
   // the following code is not needed at all
   //.then(data => {
   //   return data
   // })
   // I prefere not to do the error handling here,
   // instead let the caller handle the error
   .catch(error => console.error(error))

}

现在fetch posts函数实际上返回了一些内容，我只能告诉您，第一个代码片段中的函数内部没有办法返回fetchPosts promise解析为的发布的新状态。不过，它看起来很像是reducer，因此，我建议您看一下redux-thunk，它允许您使用中间件来增强redux的异步行为，然后可以将函数分派到返回promise的商店。

错误承诺地获取数据

2 个答案: