小编pne*_*uma的帖子

Apollo Client 和 React Redux-Toolkit 状态管理应该如何?

我非常困惑。在真正的问题出现之前,让我告诉你我是如何开始的。也许我走错了路。所以你可以建议其他方法

我们的项目中不使用 graphql 进行登录和注册。注册由 5 个阶段组成,我使用了 React redux-toolkit,因为我在管理状态时遇到了麻烦。我使用 axios 库进行登录和注册 API 调用。

我用 redux 将模块分割成切片。起初听起来很简单。我将从 axios 返回的数据设置为相关切片的状态。

例如,在注册第一步之后,我将从 axios 获得的结果设置为 SignUpSlice 状态中的firstStepData 键。然后我可以从其他步骤访问firstStepData。

到目前为止,没有问题。

用户登录后我们所有的API请求都是用graphql配置的。问题就从这里开始。其实不是问题。我只是不知道该怎么办。

axios 支持 graphql,但用法并不完全是我想要的。所以我认为 apollo-client 会更适合我的项目。

让我们以设置页面为例。

我的设置页面代码;

const GET_SETTINGS = gql`
  ...query
`;

const SettingsPage = () => {
  const { loading, error, data } = useQuery(GET_SETTINGS);

  if (loading) return 'Loading...';
  if (error) return `Error!`;

   return (
      <Settings>
         <Logo />
         <UpdateForm />
         <DeleteButton />
      </Settings>
   );
};
Run Code Online (Sandbox Code Playgroud)

所以,我可以像这样将数据传输到子组件<Settings data={data}>但是在嵌套组件中传输这样的数据不是很累吗?或者,如果我想从不属于设置页面的其他组件访问此数据?如何将此数据传输到子组件?

这种情况,我应该按照注册时的方式进行吗?我是否必须使用 redux 创建 SettingsSlice,然后将 …

reactjs redux react-redux react-apollo apollo-client

6
推荐指数
1
解决办法
3198
查看次数