onChange 不会在反应中触发 NumericInput

Question

i have the following component where the onChange is not triggering, it is quite simillar to the following post props onChange is not triggering however the solution isnt helping much

basically its creating a form based on a parsed xml, the inputGroup is correctly triggering the onchange function while the NumericInput isnt triggering the onchange.

any help appreciated.

    <!-- language: lang-js -->

    import React from 'react';
    import { NumericInput, InputGroup,FormGroup } from "@blueprintjs/core";
    import './palantir.css'; 

    class Byte extends React.Component {

      constructor(props) {
        super(props);
        this.handleChange = this.handleChange.bind(this);
      }

      handleChange(k,e) {
        this.props.onConfigChange(k,e.target.value);
      }

      render() {
        var minmaxlen = this.props.input_conf._minmaxlen;
        var maxlen = minmaxlen != null ? minmaxlen.split("-")[1] :''
        var minlen = minmaxlen != null ? minmaxlen.split("-")[0] :''

        var minmaxvalue = this.props.input_conf._minmaxval;
        var maxvalue = minmaxvalue != null ? minmaxvalue.split("-")[1] :''
        var minvalue = minmaxvalue != null ? minmaxvalue.split("-")[0] :''
        var pattern = this.props.input_conf._regex ? 'pattern='+this.props.input_conf._regex : ''

        console.log('minvalue================',minvalue)

        if(minvalue == '') {
          if(this.props.input_conf._regex != null) {
          return (
             <FormGroup
               className="formatcard"
               label={this.props.conf_name}
               labelFor="text-input" inline="true">
               <InputGroup pattern={this.props.input_conf._regex || ''} minLength={minlen || ''} maxLength={maxlen || ''} 
                placeholder="Placeholder text" value={this.props.input_conf.value || ''} 
                onChange={e => this.handleChange(this.props.input_conf.ID, e)} />
             </FormGroup>   
          );
        } else {
          return (
             <FormGroup
               className="formatcard"
               label={this.props.conf_name}
               labelFor="text-input" inline="true">
               <InputGroup minLength={minlen || ''} maxLength={maxlen || ''} 
                placeholder="Placeholder text" value={this.props.input_conf.value || ''} 
                onChange={e => this.handleChange(this.props.input_conf.ID, e)} />
             </FormGroup>   
          );
        }
        } else {
          return (

//this part is causing issue the numeric input is not triggering the onchange function and not updating the state
           <FormGroup
             className="formatcard"
             label={this.props.conf_name}
             labelFor="text-input" inline="true">
             <NumericInput  allowNumericCharactersOnly="true" clampValueOnBlur="true"
              min = {minvalue || ''} max ={maxvalue || ''} placeholder="Placeholder text" value={this.props.input_conf.value || ''} 
              onChange={e => this.handleChange(this.props.input_conf.ID, e)} />
           </FormGroup>   
          );
        }
      }

    }

    export default Byte;

<!-- end snippet -->

Answer 1

刚刚发现 numericInput 使用 onValueChange 而不是 onChange 以防万一这对任何人有帮助:)

Answer 2

You can check all the avialable props for your component:

https://blueprintjs.com/docs/#core/components/numeric-input[NumvericInput-doc][1]