如何直接从异步函数返回对象？

Question

• 我有 Redux 存储功能，我必须在其中创建 AJAX 并相应地更新状态。但是，我创建了以下函数，它在返回状态之前不会更新 x 值。所以，我创建了async 函数。

  var x =[]
  lookup(
      "GET",
      "api/post/",
      (response, status: number) => {
        Object.assign(x, response);
      }
    );
  console.log(x,'her x stay just ampty array []');
switch (action.type) {
    case "SetData":
      return { ...state, data: x };
    default:
      return state;
  }

---

• 在下面的示例中，我试图在函数 lookup 之外获取响应，因此我创建了一个名为 newData 的同步，如何让它直接重新运行 res 而不会在其中破坏 var。李>

const newData = async () => {
    var x: any = [];
    await lookup(
      "GET",
      "api/post/",
      (response: myArrays["posts"], status: number) => {
        Object.assign(x, response);
      }
    );
    return x;
  };
  console.log(newData().then((res) => res));


switch (action.type) {
    
    case "SetData":
      return { ...state, data: newData().then((res) => {return res}) };
    default:
      return state;
  }

---

• 请注意：我不能在我的 store 函数中使用 React.usesState()，因为它不是一个组件函数。

Answer 1

按照您尝试执行此操作的方式是不可能执行此操作的。你需要做的是这样的：

const data = await newData();
dispatch({ type: "SetData", data })

Answer 2

Redux reducer 不能是异步的。 reducer 获取先前的状态和动作并将其映射到新动作。就是这样。您不能从 reducer 分派操作或触发 API 调用。

API 调用需要在其他地方进行——在您的组件中，在redux-thunk 操作创建者中，等等。一旦 API 调用完成，您就可以使用您收到的数据发送一个“SetData”操作。然后reducer 会根据这些数据更新state。

Answer 3

以下应该有效：

const newData = async () => {
    return await lookup(
      "GET",
      "api/post/",
      (response: myArrays["posts"], status: number) => {
        Object.assign(x, response);
      }
    );
};

console.log(await newData());

这样您就可以避免按照您的要求在newData 内分配另一个var。

还可以查看redux tutorial，了解如何使用 redux 进行异步数据获取。