Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

208
Views
React.js usando entrada de formulario en otro componente

Así que estoy aprendiendo sobre cómo usar la entrada de formulario en mis proyectos de la aplicación React. No estoy muy seguro de cómo hacerlo, los accesorios realmente no parecen ser suficientes. Entonces, si tengo dos componentes, uno con un formulario y otro que solo quiero mostrar la entrada. No quiero representar los dos componentes a la vez, sino que deseo redirigir al usuario a otra vista donde se muestra la entrada. A continuación se muestra el código para el formulario simple.

 import React from 'react' import { useState } from 'react'; import { useNavigate } from 'react-router-dom'; import Second from '../view/second/Second'; const Form = () => { const navigate = useNavigate(); const [namn, setNamn] = useState(''); const [personNr, setPersonNr] = useState(''); const [datum, setDatum] = useState(''); const [planbok, setPlanbok] = useState(''); return ( <div> <form> <div> <input type="text" id="namnField" required value={namn} onChange={(n) => setNamn(n.target.value)} placeholder='Namn'></input> </div> <div> <input type="text" id="personNrField" required value={personNr} onChange={(pn) => setPersonNr(pn.target.value)} placeholder='Personnr'></input> </div> <div> <input type="text" id="datumField" required value={datum} onChange={(d) => setDatum(d.target.value)} placeholder='Datum'></input> </div> <div> <input type="text" id="planbokField" required value={planbok} onChange={(p)=>setPlanbok(p.target.value)} placeholder='Plånbokadress'></input> </div> <button type="submit" id="inputForm"onSubmit {navigate('/second')}>Enter</button> </form> </div> ) } export default Form

Y aquí está el componente que quiero mostrar en la entrada del formulario:

 import React from 'react' import Form from '../../form/Form' const Second = ({namn, datum, personNr, planbok}) => { return ( <div> <p>{namn}, {datum}, {personNr}, {planbok}</p> </div> ) } export default Second

Como puede ver, he intentado usar accesorios, esto no funciona. Claro que puedo representar el componente llamado en el componente y puedo completarlo con la entrada del formulario. Pero esto no es lo que deseo lograr, quiero que las variables de la entrada del formulario se muestren cuando represente en una vista diferente.

¿Cómo lograría esto? ¿Debería usar Ajax, el gancho useContext? ¿Hay alguna otra manera que sea mejor para manejar este tipo de situación? Gracias de antemano por tu tiempo. Saludos / Svante.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Resuelto este problema con useContext. Usó los principios en este video de YouTube sobre el tema: https://www.youtube.com/watch?v=lhMKvyLRWo0&t=342s

Creo que podría ser una mejor práctica hacer lo que escribió MrPickles como respuesta a mi primera publicación.

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!