阅读量:5
[secret,setSecret]=useState(null) useEffect(() => { http.get('/api/suggest/qrcode/', { params: { uniqueid: store.uniqueid } }).then(res => { //异步获取的值不是实时返回的 setSecret(res.secret); return http.get('/api/suggest/userinfo/', { params: { secret: secret } }) }) // eslint-disable-next-line }, [])
在上面的代码中,我想实现的业务逻辑是:
1.页面挂载后,我先请求后台接口1获取二维码和密钥
2.然后请求接口2,携带上接口1返回的密钥参数,请求二维码的状态信息,获取用户信息。
这段代码我在运行的时候,后台始终拿到的secret值是null,通过后台、前台打印日志,显示的secret是有值的,但为什么按照顺序执行了setSecret(res.secret)后,然后使用secret的值,没有实时取得res.secret值。解释就是,有延迟,在我执行请求接口2的时候,secret的值还没有更新完成。
//[secret,setSecret]=useState(null) useEffect(() => { http.get('/api/suggest/qrcode/', { params: { uniqueid: store.uniqueid } }).then(res => { //异步获取的值不是实时返回的 //setSecret(res.secret); return http.get('/api/suggest/userinfo/', { params: { secret: res.secret} }) }) // eslint-disable-next-line }, [])
直接将接口1拿到的数据进行请求。这时后台能够正确拿到密钥信息进行后续处理。