Hice input used {useform} library . Era apropiado utilizar muchas "entradas".
Sin embargo, la vista previa de la imagen "Enter" no funciona. Traté de obtener una vista previa de la imagen. Espero que obtengas ayuda.
background-image: url(null); It's printed.
import { useForm, Controller } from 'react-hook-form'; import Select from 'react-select'; const SingleInput = () => { return( const [fileUrl, setFileUrl] = useState(null); const saveFileImage = event => { const imageFile = event.target.files[0]; const imageUrl = URL.createObjectURL(imageFile); setFileUrl(imageUrl); }; <label> add Media <input type="file" onChange={saveFileImage} accept="image/*" {...register('file')} /> </label> <div style={{ backgroundImage: `url(${fileUrl})`, }} /> )Eso es porque su método onChange en la entrada es anulado por onChange from register() . Intente obtener datos del mismo useForm o envuelva la entrada en el controlador, para que pueda personalizar este comportamiento.