javascript - 当特别指定 type="number" 时，输入字段值的默认类型是什么？

Question

我正在使用带有 React 钩子和上下文 Api 的 reactJs，在正常的 html 表单中，我必须输入类型为文本的标签，当我试图知道我们在 javascript 中使用“typeOf”函数获得什么类型的值时. 当我输入字符串值时，我得到了字符串类型，但是当我输入一个数字时，它显示为未定义。

const [name, setName] = useState('');
const [price, setPrice] = useState('');
const [movies , setMovie] = useContext(MovieContext) 

const updateName = (e) => {
    setName(e.target.value)
}

const updatePrice = (e) => {
    setPrice(e.target.price);
}

const addMovie = (e) => {
    e.preventDefault();
    setMovie(prevMovies => {
       return [...prevMovies, { name: name, price: price }]
    })
    console.log(typeof(price)) //getting undefined
    console.log(typeof(name)) //getting string 
}

return ( 
    <div>
       <form onSubmit={addMovie}>
           <input type="text"  name="name" value={name} onChange={ updateName }/>
           <input type="text"  name="price" value={price} onChange={ updatePrice } />
           <button>Submit</button>
       </form>
    </div>
 );

标签： javascripthtml

Answer 1

您应该将值解析为数字，以便将值作为数字获取，因为您没有price存储该值的属性。

setPrice(Number(e.target.value));

此外，您也可以将输入的类型更改为数字