useParams 钩子的异步行为

Question

我们如何管理

useParams

的行为 它如何在之前或之后触发

useEffect

import react,{useEffect} from 'react'
import {useParams} from 'react-router-dom'

export default Slip(){
  const {slug} = useParams()
  useEffect(() => {
    // In my application role of slug is very important for application behaviour 
    const fetchdata = async () => {
      const getd = await axios.post('backend.com',{slug})
      // Here slug needs to be loaded completely without it application can't behave properly 
    }
  },[])
}

我的公司正在开发一个银行项目，我们从参数中获取 slug，这对于加载删除交易非常重要

那么有什么方法可以实现 useParams 的异步行为或**当加载参数时，只有代码会执行**

Answer 1

如果在执行

slug

中的逻辑之前需要

useEffect

的非空值，请在执行该逻辑之前检查该值。 您还可以将

slug

添加到依赖项数组中以获得效果，以便每当值发生变化时它都会重新运行。 例如：

  useEffect(() => {
    if (!slug) return;

    // In my application role of slug is very important for application behaviour 
    const fetchdata = async () => {
      const getd = await axios.post('backend.com',{slug})
      // Here slug needs to be loaded completely without it application can't behave properly 
    }
  }, [slug])