React Hooks useEffect在路线更改时再次调用

Question

整个代码在这里：https://codesandbox.io/s/polished-sea-krlff

主要问题是在路线更改时再次调用useEffect。

1. 通过以下方式从Hooks主页转到“员工”页面：props.history.push（'/ employee'）;
2. 通过以下方式从Employee页面返回到HooksMain页：props.history.push（'/'）;
3. 这再次触发useEffect和另一个服务调用，尽管它取决于参数“ test”。

以下详细信息：

第一个功能组件：

import React, {
  useState,
} from 'react';

function HooksMain(props) {
  const [test, setTest] = useState('');

  useEffect(() => {
    console.log('test', test);
  }, [test]);

   const redirectToNewPage = () => {
    props.history.push('/employee');
  };

return (
//Return something
)
}

当我从Employee页面重定向回HooksMain时，useEffect再次被触发。在我的原始代码中，它触发了我不需要的Web服务调用。它会继续拨打额外的服务电话。

请求帮助！