您的代码有时调用useSelector一次，有时调用两次。
如果你把

const getTopicId = useSelector((state) => state.topics.selectTopic.topicId) !== "" ? useSelector((state) => state.topics.selectTopic.topicId) : JSON.parse(localStorage.getItem("topic")).topicId;

然后将三进制重写为if..else，您可以清楚地看到：

let getTopicId;
const conditionTopicId = useSelector((state) => state.topics.selectTopic.topicId)
if (conditionTopicId !== "") {
  getTopicId = useSelector((state) => state.topics.selectTopic.topicId)
} else {
  getTopicId = JSON.parse(localStorage.getItem("topic")).topicId
};

有时你调用一个钩子一次，有时两次。这违反了钩子的规则，从长远来看会使React崩溃。
在您的情况下，您可以将其改写为非常简单的内容：

let getTopicId = useSelector((state) => state.topics.selectTopic.topicId)
if (getTopicId == "") {
  getTopicId = JSON.parse(localStorage.getItem("topic")).topicId
}

突然间，你只叫了一次钩子--而且你没有条件地这样做。
您也可以使用三元，并将逻辑放在一个钩子调用中：

const getTopicId = useSelector(
  (state) => 
    state.topics.selectTopic.topicId !== "" ? 
      state.topics.selectTopic.topicId :  
      JSON.parse(localStorage.getItem("topic")).topicId
  )

所有这些替代方案都很好--唯一重要的是：不要在条件内调用useSelector（三元组只是编写if...else的一种简短方法）。
React不允许这样做，如果你这样做，它迟早会崩溃在你身上。

useSelector返回与从本地存储发送的任何值都不兼容的特定类型
处理这种情况的最佳方法是添加单独的useMemo变量

const {selectTopic} = useSelector((state) => state.topics)

const getTopicId  = useMemo(() => {
   return  selectTopic.topicId !== "" ? getTopicSelector : JSON.parse(localStorage.getItem("topic")).topic
}, [selectTopic])