Promise 如何与 #then 和 #json 一起使用？

Question

我对为什么第一个示例有效，但第二个无效。我相信这与调用 json 将响应解析为 javascript 对象有关吗？那么它返回一个必须放入 then 函数的承诺？由于第三个示例中抛出的错误，我得到了这个。 #json 究竟做了什么？

export const promiseErrorMiddleware = store => next => action => {
  const url = action.url
  const fetchName = action.fetchName
  return Promise.resolve(fetch(url)).then((response) => {
    return response.json()
  }).then((data) => {
    store.dispatch({data: data, needDirection: true, fetchName: fetchName })
  })
}

//works

export const promiseErrorMiddleware = store => next => action => {
  const url = action.url
  const fetchName = action.fetchName
  return Promise.resolve(fetch(url)).then((response) => {
    store.dispatch({data: response.json(), needDirection: true, fetchName: fetchName })
  })
}

//doesn't work

export const promiseErrorMiddleware = store => next => action => {
  const url = action.url
  const fetchName = action.fetchName
  return Promise.resolve(fetch(url)).then((response) => {
    console.log(resopnse.json())
    return response.json()
  }).then((data) => {
    store.dispatch({data: data, needDirection: true, fetchName: fetchName })
  })
}

//throws error

Answer 1

response.json() 返回一个承诺。你不能立即使用它的结果，你必须等待promise解决。

另外，您不需要使用Promise.resolve()。 fetch() 已经返回了一个承诺。

你可以写{data}，而不是写{data: data}。这称为shorthand property names。

您的第三个示例引发错误，因为您不能两次调用 json() 方法。