在反应本机文本输入中获取NaN

Question

I am trying to parcel the value of one text input into another text input with a restricted maxLength of 2, when I type in a number and clear it, I am getting NaN, it does not revert back to the original state of 0. However, I also want the user to be able to clear out the textinput completely thereby leaving the textinput with just the placeholder

below is my code

      this.state = {
        total: 0,
      }


      onChangeTotal(number) {
        const total = parseInt(number);
        this.setState({ total });
      }



      <InputField
        value={this.state.total.toString()}
      />
      <InputField
        children={'Number of shoes'}
        iconType={'ios-basket'}
        placeholder={'Enter number of shoes'}
        keyboardType={'phone-pad'}
        maxLength={2}
        onChangeText={this.onChangeTotal}
        value={this.state.total.toString()}
      />

Answer 1

Check the length value of the number to see if the text is present.

 onChangeTotal(number) {
        const total = parseInt(number);
        if(number.length === 0) {
          this.setState({ total: '' });
        } else {
         this.setState({ total });
        }
      }

Answer 2

<input value={this.state.total} type="number" min="0" max="99" onChange={(e) => this.setState({ total: e.target.value })} />