0
91
Views¿Cómo obtengo el valor de un elemento después de hacer clic en otro?
En React, ¿cómo puedo obtener el valor de otro elemento haciendo clic/cambiando uno diferente?
<div> <input {get this value}/> <button onClick={()=> console.log(get value of above input field)}/> </div>
·
Juan Pablo Isaza
2 answers
Answer question0
Puede usar document.getElementById().value
export default function App() { function getText() { var myInputText = document.getElementById('myInput').value; console.log('Input text:', myInputText); } return ( <div> <input id="myInput" /> <button onClick={() => getText()}>Get Text</button> </div> ); }O puede usar Formularios y useState Hook
export default function App() { const [name, setText] = useState(''); const handleSubmit = (evt) => { evt.preventDefault(); console.log(`Input text: ${name}`); }; return ( <form onSubmit={handleSubmit}> <input type="text" value={name} onChange={(e) => setText(e.target.value)} /> <input type="submit" value="Submit" /> </form> ); }
·
Juan Pablo Isaza
Report
0
1) Entrada controlada usando gancho useState
const [inputValue, setInputValue] = useState(""); function onInputChange(e) { setInputValue(e.target.value); } const getValue = () => console.log(inputValue); return ( <div> <input value={inputValue} onChange={onInputChange} /> <button onClick={getValue}>get value</button> </div> ); 2) Entrada sin control usando el gancho useRef
const inputRef = useRef(""); const getValue = () => console.log(inputRef.current.value); return ( <div> <input ref={inputRef} /> <button onClick={getValue}>get value</button> </div> );
·
Juan Pablo Isaza
Report
Answer question