Как получить актуальный id, если useState не отражает изменения немедленно?

Question

[BladeHeroku]

Хочу сделать форму для авторизации, но при нажатии на теги input, получаю старые id тегов input'ов, которые были шаг назад. Как мне решить эту проблему?

P.S В console.log(editAnswer), я вывожу id инпутов.

import React, {useState} from 'react';

const Form = () => {

    const [answers, setAnswers] = useState(['1', '2', '3'])
    const [editAnswer, setEditAnswer] = useState(null)

    function changeElement(event) {

        setAnswers(
            [
                ...answers.slice(0, editAnswer),
                event.target.value,
                ...answers.slice(editAnswer + 1)
            ]
        )
    }

    function initialInput(index) {
        setEditAnswer(index)
        console.log(editAnswer)

        if (editAnswer)
            return answers[editAnswer]
        return answers[0]
    }


    function result() {
        console.log(answers)
    }

    return (
        <div style={{display: 'flex', flexDirection: "column"}}>
            {
                answers.map((answer, index) =>
                    <input key={index}
                           value={answer}
                           onChange={changeElement}
                           onClick={() => initialInput(index)}
                           type="text" />
                )
            }
            <button onClick={result}>Результат</button>
        </div>
    );
};

export default Form;