react hooks 使用userState获取不到最新值？

Question

functiong mov(){
const [source, setSource] = useState([]);
}
useEffect(() => {

const hide = message.loading('正在加载');
try {
  if (id !== '') {
    fetchData().then(r => hide());
  }
} catch (e) {
  hide();
}

}, []);
//读取数据，并且放入一个数组中
function fetchData() {

setSource(async ()=>{
  const res = await queryBilling(id);
  return res;//这里可以获取值
})
   console.log(source,'data') ----这里获取不到source的值？？？？？
//查询接口

}

Answer 1

建议你这样写

const func = async () => {
  const res = await queryBilling(id);
  if (res) {
    setSource(res);
  }

}

Answer 2

useState set给他新的值 他是个异步操作 所以你下面直接去console可能会没同步
你直接useEffect去监听source去看console 其实他是有更新的

建议你方法用useCallback

Answer 3

setSource的实参不可以是异步函数，可以改成这样：

async function fetchData() {
    // ......
    const res = await queryBilling(id);
    setSource(res);
    // ......
}

看代码片段还发现其他问题：

1. useEffect的参数函数内部依赖了id变量（猜测来自props），最好把id添加到依赖数组里；
2. 既然都使用async/await了，就尽量不要再手动写Promise相关的方法了。

综上代码建议这样组织：

useEffect(() => {
    let unmount = false;
    const hide = message.loading('正在加载');    
    ;(async () => {
        try {
          const res = await fetchData(id);
          !unmount && setSource(res);
        } catch (e) {
          //....
        } finally {
            hide();
        }
    })()
    
    return () => {
        unmount = true;
        hide();
    }
}, [id]);

async function fetchData(id) {
    if(!id) {
        throw new Error('id is required');
    }
    // ......  
    const res = await queryBilling(id);
    return res;
    // ......
}

Answer 4

const [department_classitems,setDepartment_classitems]=useState([]);

useEffect(() => {
const hide = message.loading('正在加载');
try {
fetch_Department_Data().then(r => hide());//读取部门数据
fetchData().then(r => hide());//读取员工档案
fetch_Leave_Data().then(r => hide());//读取离职员工档案
} catch (e) {
console.log(e);
hide();
}
}, []);
//读取部门数据
async function fetch_Department_Data() {
const res = await queryDepartment(); //调用查询方法
setDepartment_classitems(res);
}
//读取员工档案
async function fetchData() {
const res = await queryEnter({ status: 1 });
for (let i = 0; i < res.length; i++) {
const ditem=department_classitems.find(item=>item.id==res[i].department_id); -------这个department_classitems为空，拿不到值，
res[i].department_name=ditem.department_name;
res[i].key = i;
res[i].index = i;
}
setData(res);
}

之前一直都没有用过promise的写法，但是一直获取不到值，也没想到其他的解决办法，就想问下在这种情况下该怎么写，我在fetchData里面可以获取到department_classitems