-1

I am new to react. I want to get value of input with type number.

var x = //now I want to get value of an input

Could you help me with it please?

reza kakaei
  • 9
  • 1
  • 2
    Does this answer your question? [How to get the value of an input field using ReactJS?](https://stackoverflow.com/questions/36683770/how-to-get-the-value-of-an-input-field-using-reactjs) – Kevin B Jun 22 '22 at 19:15
  • 1
    You really should try [introductory tutorials](https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_interactivity_events_state#reading_user_input) before asking questions on SO. – Quentin Jun 22 '22 at 19:15
  • generally... you want to react when the value changes and store that state, then you can access it when you react to something else, such as the form submit, without going to the dom. – Kevin B Jun 22 '22 at 19:31

2 Answers2

0

You can find the help by using the below code and you can run it also to get the value of event.

function App() {

  const handleOnChange = (e) => {
    console.log(e.target.value);
  }

  return (
    <div className="App">
      <input name='myInput' type={"text"} onChange={(e) => handleOnChange(e)} />
    </div>
  );
}
Cool Coder
  • 3
  • 4
  • As it’s currently written, your answer is unclear. Please [edit] to add additional details that will help others understand how this addresses the question asked. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Sep 21 '22 at 15:55
-1

This can be don't with multiple ways.

You can set the onChange or onInput event on the input element to get the value of the input whenever the user writes on the input element. Ex:

<input onChange={(event) => console.log(+event.target.value) }

Also, you can have a template reference from the input, you can use it whenever you need to get the input in a specific condition, let's say add an event listener depending on a condition or get its value depending on another element event.

For example, ( password and confirm password inputs ).

Code Ex:

import { useRef } from 'react'

const inputRef = useRef()

<input ref={inputRef} />

And whenever you want to get the input value

inputRef.currunt.value
Mina
  • 14,386
  • 3
  • 13
  • 26
  • 1
    Using a reference is very rarely a good idea. – Quentin Jun 22 '22 at 19:13
  • I just output the possible ways which can be done. ( and he can choose depending on his needs ). Maybe other users also answer with better ways. – Mina Jun 22 '22 at 19:14
  • You haven't provided any information that would allow them to determine which fits their needs. – Quentin Jun 22 '22 at 19:16
  • Because I don't know his needs, he just asked about how to get value from the input. – Mina Jun 22 '22 at 19:16
  • That doesn't stop you explaining when the different approaches are useful. – Quentin Jun 22 '22 at 19:17
  • Sir, I think he is a new developer or at least new to javascript and react, if I provided him a lot of details, it will be complex for him, and maybe that confuse him, I think for a newbie go straight with information better, and if he was interested about details, he would search from the beginning. – Mina Jun 22 '22 at 19:21
  • Multiple options with no information about which is suitable for where is worse. Especially when dealing with references which are very edge case. – Quentin Jun 22 '22 at 19:22