los "input" name y price me guardan sin problemas a firestore de firebase pero ahora necesito subir una imagen tambien pero no he podido.
He intentado de muchas formas pero no sube la imagen solo quedan guardados los input name y price. En el momento que guardo toda la información de los input van a firestore sin problemas menos el campo imagen y necesito que quede la imagen también suba y quede guardada.
he intentado de muchas formas pero todavía no he podido lograr que guarde, y si la envió así como esta solo guarda la ruta y no mas.
function Contenido() {
const[image,setImage] = useState('')
const[name,setName] = useState('')
const[price,setPrice] = useState(0)
const[error,setError] = useState('')
const[usuario, setUsuario] = useState([])
const setUsuarios = async (e) => {
e.preventDefault()
const usuario = {
image:image,
name:name,
price:Number(price)
}
try{
const data = await store.collection('productos').add(usuario)
}catch(e){
}
}
return (
<div className="content-wrapper">
<div className="content-header">
<div className="container-fluid">
<div className="row mb-2">
<div className="col-sm-6">
<h4 className="m-0">CONTENIDO</h4>
</div>
</div>
</div>
</div>
<section className="content">
<div className="container-fluid">
<div className="row">
<div className="col-md-6">
<h2>Formulario de usuarios</h2>
<form onSubmit={setUsuarios} className="form-group">
<input value={name} onChange={(e)=>{setName(e.target.value)}} type="text" className="form-control" placeholder="Introduce el nombre" />
<input value={price} onChange={(e)=>{setPrice(e.target.value)}} type="number" className="form-control mt-3" placeholder="Introduce el precio" />
<input onChange={(e)=>{setImage(e.target.value)}} className="form-control" type="file" id="formFile" />
<input type="submit" value="registrar" className="btn btn-dark btn-block mt-3" />
</form>
{
error ?
(
<div>
<p>{error}</p>
</div>
)
:
(
<span></span>
)
}
</div>
<div className="col-md-6">
<h2>Lista de tu agenda</h2>
</div>
</div>
</div>
</section>
</div>
)
}
export default Contenido