Javascript 如何修复在同一路由上重新加载页面时重新加载组件？

我有一个组件，它是一个子组件。它有自己的路线。当我尝试重新加载此路由上的页面时，此组件会自动更新两次而不是一次。如何修复它？它正在获取资源并获取两次信息，而不是一次

我试着给父组件添加一些逻辑，这样它就可以通过我需要的道具，但它已经通过路由器了

const ItemDetails = (props) => {
  const countryService = new CountryService();
  const [country, setCountry] = useState('');
  const [code, setCode] = useState(props.match.params.code);

  useEffect(() => {
    setCode(props.match.params.code)
    updateCountry()
  }, [])

  const updateCountry = () => {
    countryService
      .getByName(code.toLowerCase())
      .then((country) => {
        setCountry(country)
      })
  }

  return (
    <ItemView country={country}/>
  )
}

const ItemDetails=（道具）=>{
const countryService=new countryService（）；
const[country，setCountry]=useState（“”）；
const[code，setCode]=useState（props.match.params.code）；
useffect（（）=>{
设置代码（props.match.params.code）
updateCountry（）
}, [])
const updateCountry=（）=>{
乡村服务
.getByName（代码.toLowerCase（））
.然后（（国家）=>{
国家（国家）
})
}
返回(
)
}

---

我希望组件只获得一次信息

我已经将状态[loaded，setLoaded]添加到我的应用程序组件中，以便在它获得信息后将loaded设置为true。首次加载的Item details呈现时的默认值为false，并且不更新国家（）

---

你能在codesandbox上添加工作代码吗？该组件位于“项目详细信息”文件夹中

  useEffect(() => {
    if (props.isLoaded) {
      updateCountry(props.match.params.code);
    }
  }, []);