react hooks useState更新值不及时的解决方案

react hooks中useState更新值后经常会出现值更新不及时的bug，可以使用以下思路解决

import React, { Component, useState } from 'react'
import ReactDom, { render } from 'react-dom'

const Hooks = () => {
    const [num, set_num] = useState(0)
    const [age, set_age] = useState(0)
    const add_age = () => {
        set_age((data) => {
            let new_data = data + 1
            set_num_handle(new_data)
            return new_data
        })   //使用函数，而不是固定值，将最新值传给要处理的函数，并返回给这个设置值的函数

    }
    const set_num_handle = (new_data) => {
        set_num(new_data)
    }
    return (<div>
        <div>
            年龄:{age}
        </div>
        <div><button onClick={add_age}>设置{num}</button></div>
    </div>)
}

ReactDom.render(<Hooks />, document.querySelector('#root'))

总结:上面的思路就是const [state,setState]=useState(0),使用setState()这个函数赋值的时候，不是传入一个固定的值，而是使用setState((data)=>{let new_data=data+1;return new_data})得到最新的值，函数中的data是当前等待处理的值