React - Eingabewert, um eine Nummer zu generieren, die nicht funktioniert

Question

Ich versuche React zu lernen und stecken geblieben versuchen, eine Eingabe in einer Zahl zu nehmen, dann übergeben Sie diese Zahl, wenn die Schaltfläche Senden getroffen wird. Das meiste funktioniert (unten), aber wenn ich submit drücke, wird meine Nummer in eine Zeichenkette umgewandelt und ich weiß nicht was. Jede Hilfe oder Anleitung hier helfen würde, danke

import React from 'react'; 
import Stars from './star' 

class StarMaker extends React.Component { 
    constructor(props) { 
    super(props); 
    this.state = { 
     numStars: 200, 
    } 
    } 
    setNumStars(num) { 
    console.log(typeof num); 
    const numPulses = [...Array(num).keys()]; 
    console.log(numPulses); 
    this.pulses = numPulses.map(i => this.generatePulse(i)); 
    } 

    handleClick() { 
    this.setNumStars(this.state.numStars) 
    } 

    handleChange(e) { 
    console.log(e); 
    this.setState({ 
     numStars: Number(e.target.value) 
    }) 
    } 

    getRandomNumber(min, max) { 
    return Math.floor(Math.random() * (max - min + 1)) + min; 
    } 

    generatePulse(i) { 
    const props = { 
     key: i, 
     top: this.getRandomNumber(-385, 556), 
     left: this.getRandomNumber(1, 2430), 
     scale: `scale(${this.getRandomNumber(1, 2)})`, 

    } 
    return (<Stars {...props} />) 
    } 
    componentWillMount() { 
    const numPulses = [...Array(this.state.numStars).keys()]; 
    this.pulses = numPulses.map(i => this.generatePulse(i)); 
    } 
    render() { 
    console.log('render'); 
    return (
     <div> 
     {this.pulses} 
     <input value={this.state.numStars} onChange={this.handleChange.bind(this)} type="number"></input> 
     <button onClick={this.handleClick.bind(this)}>Submit</button> 
     </div> 
    ); 
    } 
} 

export default StarMaker; 

Answer 1

Der input Wert in HTML wird immer ein string sein, egal welche type werden Sie angeben. Having said that, wenn Sie einen number Datentyp statt string verwenden müssen, müssen Sie es explizit werfen, im Wesentlichen durch den numerischen Wert aus der String-Analyse:

parseInt(this.state.numStars, 10);