HOOKS的useState达到同步更新效果

最近一直跟着项目自学自用hooks，将旧的项目改为新的写法，也是在一点点学习的过程。

遇到的问题是：在使用hooks的过程中，想要在修改state数据后再执行请求接口API的逻辑。

如下：

const [filterParams, setFilterParams] = useState({ cate1Id: 101, pageNum: 1, pageSize: 10 })
// 当子组件执行父组件的方法并回传了一个参数，想要在state更新后再调用API
const onFetch = (params) => {
    setFilterParams(params)
    fetchList(params)
}

const fetchItemCodeList = (async (params) => {    
    setTableLoading(true)    
    const res = await fetchListApi({ ...filterParams, ...params })   
    setTableLoading(false)
})

但是这样其实是不会生效的，因为setFilterParams是异步的，导致在请求接口时的参数不对。

同时想到的是，类声明的时候，this.setState()可以通过执行回调使得state更新后再执行回调，那hooks中执行set方法的时候，相当于执行this.setState()，但是又没有提供回调函数的参数。

那可以怎么办呢？

其实可以使用useEffect来解决这个问题，方法就是采用useEffect的依赖项，使得state更新后，监听到依赖项的变化，自动执行useEffect的相关逻辑。

useEffect(() => {
    fetchItemCodeList()
}, [filterParams])
// 当子组件执行父组件的方法并回传了一个参数，想要在state更新后再调用API
const onFetch = (params) => {
    setFilterParams(params)
    // fetchList(params)
}