关于使用redux工具包和react-query创建API的问题

nzkunb0c  于 2023-01-21  发布在  React
关注(0)|答案(1)|浏览(121)

这更多的是一个问题,对于编码和redux-toolkit来说,我是一个新手,我已经构建了一个api,可以从服务器获取一堆项目,根据文档,这应该是一个简单的事务。
创建api,得到钩子,钩子会提供你在组件中使用的属性。类似这样。

const {
    data: items, 
    isError,
    isLoading,
    isSuccess,
  } = useGetTravelItemsQuery();

然而,基于文档和一些在线教程,他们推荐使用createEntityAdapter()来对re response进行排序,这需要额外的代码:

const travelItemsAdapter = createEntityAdapter<travelItem>({
  sortComparer: (a, b) => {
    let x = a.country.toLowerCase();
    let y = b.country.toLowerCase();
    if (x < y) {
      return -1;
    }
    if (x > y) {
      return 1;
    }
    return 0;
  },
});

这需要创建一个初始状态,这样你就可以用getInitialState()方法来生成它。除此之外,你还必须正式化状态,并在transformresponse中返回它,并提供标签,这样如果任何时间无效,数据就会被重新获取。
API状态不是已经知道你创建的tagType是否发生了变化吗?我觉得这里有很多样板文件。而且响应被分成了两个实体和id,我不知道如何在组件中使用它,因为类型太多了。请参阅下面的整个API:
一个二个一个一个
我确实看到了使用redux-toolkit的好处,但是我想我正在进入一个兔子洞,因为我学到了太多东西。上面的是处理请求和API创建的一个好的实践吗?

dddzy1tm

dddzy1tm1#

嗯,我是Redux的维护者,我认为你把事情弄得太复杂了:)
我猜你指的是https://redux.js.org/tutorials/essentials/part-8-rtk-query-advanced#transforming-responses我写的www.example.com。
RTK查询是一个“文档缓存”样式的工具。这意味着默认情况下,它只保存服务器返回的任何数据,格式完全相同。如果服务器响应是一个数组,则它保存该数组。如果服务器返回一个对象,则它保存该对象。

  • 如果 * 你想把服务器发送的数据转换成不同的结构并保存,是的,你可以使用transformResponse来完成。* 有 * 可能使用createEntityAdapter把接收到的数组转换成一个标准化的查找表,并缓存那个标准化的值。

但是,这完全是“可选的”,而不是你需要一直做的事情。另外,“要点”教程的重点是向你介绍你可以用Redux Toolkit做的许多不同的事情,但这个例子并不是要说你必须总是这样做。
如果服务器向您发送一个数组,而您要做的只是确保它已排序,那么您有两个选项:

  • transformResponse中排序,然后返回
  • 在组件中进行排序

这两种方法都不需要使用createEntityAdapter

相关问题