Установка значения элемента управления в обработчике onChange другого элемента управления в React Bootstrap

Question

У меня есть функциональный компонент (так что нет "this"), который отображает два элемента управления формой из React Bootstrap 1.0.1. Один из них - это файловый элемент управления, а другой - текстовый элемент управления. В обработчике onChange файлового элемента управления я хотел бы установить значение текстового элемента управления.

Это не должно быть так сложно.

Answer 1

проверьте этот пример:

import React, {useState} from "react";

export default function FileExample(props){

    const [filename, setFilename] = useState('');

    function changeHandler(e) {
        console.log(e.target.value);
        setFilename(e.target.value);
    }

    return(
        <div>
            <input type="file" onChange={changeHandler} />
            <input type="text" value={filename}/>
        </div>
    );
}