export default function App() {
const [value, setValue] = React.useState("defaul");
const clickHandler = (e) => {
e.preventDefault();
console.log('test');
};
const onBlur = (e) => {
console.log('on blur', e.defaultPrevented);
};
return (
<div className="App">
<input
value={value}
onChange={() => setValue("change")}
onBlur={onBlur}
onFocus={() => setValue("focus")}
/>
<button onMouseDown={clickHandler}>button</button>
</div>
);
}<div>
{editMode ? (
<div>
<MyInput
value={editTodoText}
onChange={(e: ChangeEvent<HTMLInputElement>) =>
setEditTodoText(e.currentTarget.value)
}
onBlur={() => {
setEditMode(false)
}}
autoFocus={true}
type="text"
/>
<MyButton onClick={updateTodo}>Save</MyButton>
</div>
) : (
<span className={todo.status ? s.completed : ''}>{todo.title}</span>
)}
</div>