til / Use valueAs* on inputs
If you want to get the value of an input as a number or a date, you could parse the value of a text input. However, there’s an easier solution by using valueAsNumber or valueAsDate. The attributes are only available for certain input types and return NaN if not available or if the value is invalid.
Browser support is great, valueAsNumber is supported by all browsers (even IE) and valueAsDate is supported by all browsers except IE.
<!—- This will always return NaN since valueAsNumber is not available on text inputs —->
<input type="text" onChange={e => console.log(e.target.valueAsNumber)} />
<!—- Return the value as an integer or a
float depending on the input's step attribute —->
<input type="number" onChange={e => console.log(e.target.valueAsNumber)} />
<!—- Return the date as a UNIX timestamp, i.e. new Date().getTime() —->
<input type="date" onChange={e => console.log(e.target.valueAsNumber)} />
<!—- Return the date as a JS Date object —->
<input type="date" onChange={e => console.log(e.target.valueAsDate)} />