代码:
import { useNavigate,useParams } from 'react-router-dom';
// 组件函数
const HospitalSchedul = () => {
const navigate = useNavigate()
// 科室数据
const [dep,SetDep] = useState<DepList>([])
// 获取科室回调
const getDepList = async()=>{
// 返回当前匹配路由的路由参数
const {hoscode} = useParams()
const res = await reqGetDepList(hoscode as string)
SetDep(res)
}
useEffect(()=>{
getDepList()
},[])
错误:
意思是:在函数“getDepList”中调用React Hook“useParams”,该函数既不是React函数组件,也不是自定义React Hoop函数。React组件名称必须以大写字母开头。React Hook名称必须以单词“use”开头React hooks/hooks规则;大概意思是使用useParams要在React函数组件中使用,而getDepList不是组件函数
解决:在组件函数就调用useParams()获取路由参数
// 组件函数
const HospitalSchedul = () => {
const navigate = useNavigate()
// 返回当前匹配路由的路由参数
const {hoscode} = useParams()
// 科室数据
const [dep,SetDep] = useState<DepList>([])
// 获取科室回调
const getDepList = async()=>{
const res = await reqGetDepList(hoscode as string)
SetDep(res)
}
useEffect(()=>{
getDepList()
},[])
}