Есть ли способ обновить sh состояние после каждого события onClick в реагировать?

Question

Я пытаюсь получить список json объектов, таких как:

[ {yes: 1, no: 0, nil: 0},
 {yes: 0, no: 1, nil: 0}, 
{yes: 1, no: 0, nil: 0},
 {yes: 0, no: 1, nil: 0}].

, однако, как только я нажимаю на любой из вышеперечисленных, он остается равным 1, и в конечном итоге все становится 1 что не то, что я хочу:

[ {yes: 1, no: 0, nil: 0},
     {yes: 1, no: 1, nil: 0}, 
    {yes: 1, no: 1, nil:0 },
     {yes: 1, no: 1, nil: 1}]

для каждого клика я хочу записать состояние sh в базу данных Firebase и затем извлечь его из приложения как объект json для построения графика.

export default class Vote extends Component {
constructor(props) {
  super(props)
  this.state = {
     yes: 0,
     no: 0,
     nil: 0,
  };
  this.current = [];
};
handleClick = (e) => {
    const ref = baseDb
        .ref("votes")
        ref.push({
            dataset: this.state
        })
    this.setState({[e.target.name]: 1 })
    this.current.push(this.state) 
    console.log(this.current)    
}

<div className="form-group row">
                        <div>
                            <button  className="btn btn-primary" onClick={this.handleClick}
                            name= "yes"
                            >
                            Yes
                            </button>
                        </div>
                        <div>
                            <button className="btn btn-primary" onClick={this.handleClick}
                            name= "no"
                            >
                            NO
                            </button>
                        </div>
                        <div>
                            <button className="btn btn-primary" onClick={this.handleClick}
                            name= "nil"
                            >
                            Undecided
                            </button>
                        </div>
                    </div>

Answer 1

Состояние работает асинхронно c, если вы установите sh свое состояние в this.current после немедленной установки состояния, состояние, возможно, не было бы установлено в то время, было бы лучше сделать это pu sh внутри хука componentDidUpdate, который будет ждать, пока состояние не будет изменено и компонент не будет перерисован

Answer 2

Спасибо, ребята, за ваш вклад, я смог использовать asyn c и жду решения проблемы следующим образом:

export default class Vote extends Component {
constructor(props) {
  super(props)
  this.state = {
     yes: 0,
     no: 0,
     nil: 0,
  };
  this.current = [];
};

handleClick = async (e) => {

        await this.setState({[e.target.name]: 1 })

        const ref = baseDb
        .ref("dataset")
        ref.push({
            voter: this.state
        })
    this.current.push(this.state) 
    console.log(this.current) 
    this.setState({ yes: 0, no: 0, nil: 0 })
}