Форма заполнения TodoList, не получается вывести отредактированный текст в input, какразрешить вопрос?

Question

[dromist]

Добрый день! Я создаю todo форму в react и есть кнопка изменения текста, но после изменения текста он не выводится в input. Т.е. само поле я могу изменять, но после изменения новый текст не выводится, не могу понять в чем дело, подскажите, пожалуйста.
Вот код:

import React, {useState} from 'react';

export const TodoItem = ({ todo, onChange, remove, rename }) => {
const { id, completed, title } = todo;

const [isEdited, setIsEdited] = useState(false)
const [editText, setEditText] = useState(title)

const editItem = (id) =>{
setIsEdited(prev => !prev)
}

const onEdit = (e) => {
setEditText(e.target.value)
}

const edit = (id) => {
setIsEdited(prev => !prev)
}

return (


className="input__todo"
type="checkbox"
checked={completed}
onChange={() => onChange(id)}
/>
{isEdited
? value={editText}
type="text"
onChange={onEdit}
onBlur={edit}
/>
: title
}


editItem(id)}/>
remove(id)} />


);
};

Comments

[Mesuti]

https://codesandbox.io