问题

I'm not trying to call the query hook in another component which should return cached data if the same arguments were passed to the hook avoiding a new request to be made, my issue is when forcing a refetch.

我不是在尝试在另一个组件中调用查询钩子，如果传递给钩子的参数相同，它应该返回缓存的数据，避免进行新的请求，我的问题是在强制重新获取数据时发生的情况。

I'm working on a React Native project and I'm having a small confusion regarding the inner workings of RTK Query when it comes to refetching fresh data and I can't seem to find an answer online.

我正在开发一个React Native项目，对于RTK Query在重新获取新数据时的内部工作原理，我有一点困惑，似乎在网上找不到答案。

I have a query that's getting triggered when the component mounts, and I have a useEffect that has the fetched data (which is an array of objects) in its dependencies array like so:

我有一个查询，当组件挂载时会触发它，并且我有一个useEffect，它在其依赖项数组中有已获取的数据（这是一个对象数组），如下所示：

function MyComponent(props){
  ...

  const {
    data: teams,
    refetch,
  } = useGetUserTeamsQuery({userId}, {skip: !userId || !rolesToken});

  useEffect(()=>{
    if(teams){
      console.log("teams changed...")
    } 
  }, [teams])
}

Now when the component first mounts I get teams changed... in the logs as expected, then when some event fires (socket reconnects) I call refetch to refetch fresh data in case the list of teams changed when the socket was disconnected, and the behavior I'm getting is:

现在，当组件首次挂载时，如预期地在日志中看到teams changed...，然后当某个事件触发（例如套接字重新连接）时，我调用refetch来重新获取数据，以防在套接字断开连接时团队列表发生了变化，我得到的行为是：

After the refetch, my useEffect doesn't execute when I have the exact same result being returned from the server, which is confusing to me since I can see in my debugger that the request actually fires and goes from pending status to fulfilled, so normally I should be having a new reference to the array teams thus my useEffect should get triggered since the reference has changed even if the data is still the same.

在重新获取数据之后，当服务器返回完全相同的结果时，我的useEffect不会执行，这对我来说很困惑，因为我可以在调试器中看到请求实际上已经触发，并从pending状态变为fulfilled，所以通常情况下，数组teams应该有一个新的引用，因此即使数据仍然相同，我的useEffect也应该被触发。

Then when update the list of teams (adding the user to a new team for example) my useEffect executes and I get the log in the console.

然后，当更新团队列表（例如将用户添加到新团队）时，我的useEffect会执行，并在控制台中看到日志。

So my question is, does RTK Query perform some sort of comparison between the cached data and the newly fetched one to determine if the data has somehow changed and if the answer is no it would return the same reference?

所以我的问题是，RTK Query是否会对缓存的数据和新获取的数据进行某种比较，以确定数据是否发生了变化，如果答案是否定的，它会返回相同的引用吗？

    function MyComponent(props){
      ...
    
      const {
        data: teams,
        refetch,
      } = useGetUserTeamsQuery({userId}, {skip: !userId || !rolesToken});

      useEffect(()=>{
        if(teams){
          console.log("teams changed...")
        } 
      }, [teams])

    }

答案1

得分: 1

是的，如果新的查询返回与上次查询相同的数据，您将收到相同的对象，以防止意外（和不必要的）重新渲染。

即使查询将返回部分相等的数据，该部分数据也将保持稳定。

这里的useEffect是一个数据同步机制 - 所以除非数据发生变化，它不会重新执行。如果这对您的逻辑造成问题，您可能滥用了useEffect，并且可能需要重新考虑您正在应用的实际逻辑。