Question

好像我的“ EnterPin”功能一直在重新渲染。身份验证为true时，我只需要重新渲染一次即可。

当它随后更改为/ chat时，应调用两个函数。当前的问题是它多次调用该函数。我想问题可能出在useeffect函数触发得太频繁了？你觉得呢？

因此，所需的结果是，当引脚正确时，它变为“ / chat”。在这里，您可以看到useeffect函数：

useEffect(() => {
    if (isAuthenticated === true) {
      props.history.push("/chat");
    }
  }, [props.history, isAuthenticated]);

isAuthenticated变量来自react上下文，并由以下reducer更改：

import { CHATID_FETCH_SUCCESSFUL, NEW_CURRENT_NODE_CREATED } from "./authTypes";

export default (state, action) => {
  switch (action.type) {
    case CHATID_FETCH_SUCCESSFUL:
      return {
        isAuthenticated: true,
        chatId: action.payload,
      };
    // action 5: new current Node created
    case NEW_CURRENT_NODE_CREATED:
      return {
        ...state,
        currentNode: [...action.payload],
      };
    default:
      return state;
  }
};

无论何时转到“ / chat”一侧，它都应调用以下两个函数，这些函数当前已被调用10次，但只能被调用一次：

let startEvent = fetchEventAnswerFromDialogflow(
        someParameters
      );
let frageEvent = fetchEventAnswerFromDialogflow(
        someParameters
      );

Answer 1

Ciao，问题与useEffect的部门有关。您无需添加props.history依赖项。如果添加它，则每次props.history更改其值时都会调用useEffect（这就是为什么要进行大量重新渲染的原因）。这样您的代码将变为：

useEffect(() => {
if (isAuthenticated === true && props.history.location.pathname !== "/chat") {
  props.history.push("/chat");
}
}, [isAuthenticated]);

为什么useEffect（）挂钩重新渲染超过10次？

1 个答案: