Redux查询导致每次渲染时UI闪烁

Question

我突然遇到了很多使用redux查询的UI闪烁问题。请在此处查看视频：https://files.catbox.moe/5bbs0h.mov

您看到闪烁的文本是通过redux查询获取的数据。

const {data: messages, isSuccess: isMessagesSuccess} = useGetMessagesQuery(
{id: convoId, isGroup: isGroup},
);

之后，我检查是否成功，并将相关数据设置为状态。

const [recentMessage, setRecentMessage] = useState();
useEffect(() => {
if (isMessagesSuccess) {
setRecentMessage(messages[messages.length - 1]);
}
}, [messages]);

似乎每次重新渲染组件时，文本都会消失，然后重新填充。我在应用程序的其他领域也以同样的方式处理过查询数据，但从未出现过问题。对发生的事情有什么见解吗？和/或一些关于使用redux查询的最佳实践技巧？

Answer 1

Redux查询导致每次渲染时UI闪烁？

这可能有很多原因，有可能共享一个复制示例吗？

如果这来自redux，而不是用钩子设置结果(这会触发另一个重新渲染(

您可以使用选择器：

const {data: messages, isSuccess: isMessagesSuccess} = useGetMessagesQuery(
{id: convoId, isGroup: isGroup},
{ selectFromResult: (result) => result.data[result.data.length - 1] }
);