Как получить данные из инпутов в JSX?

Делаю тестовое задание в react и redux, добавление и удаление сущностей сделал, осталось редактирование. Вопрос в том, что данные из инпутов передаются как-то странно. То есть первый элемент массива передаётся нормально, name, age, index отправляются в reducer, который изменяет state. Все последующие элементы по пути теряют свойства name, age при этом свойства index, type передаются в reducer нормально. Не смотрите на то что я в dispatch передаю тупо объект, это я переделаю когда функционал будет в порядке.

REDUCER

case 'EDIT_ITEM':
            console.log(action.name, action.age, action.id);
            return state.map((item, index) =>
                action.id === index
                    ? {
                        name: action.name,
                        age: action.age
                    }
                    : item
            );

APP.JS

function EditUsers() {
        const listItems = users.map(function (value, index) {
            return (
                <form>
                    <div className="input-group">
                        <div className="input-group-prepend">
                            <span className="input-group-text">{value.name}, {value.age}</span>
                        </div>
                        <input type="text" placeholder="New name" id="newName" className="form-control"/>
                        <input type="text" placeholder="New age" id="newAge" className="form-control" aria-describedby="button-addon2"/>
                        <div className="input-group-append">
                            <button onClick={() => dispatch({
                                type: 'EDIT_ITEM',
                                id: index,
                                name: document.getElementById('newName').value,
                                age: document.getElementById("newAge").value
                            })}
                                    className="btn btn-outline-primary"
                                    type="button"
                                    id="button-addon2">
                                Изменить
                            </button>
                        </div>
                    </div>
                </form>
            )
        });
        return (
            <div>{listItems}</div>
        )
    }

Ответы (0 шт):