Javascript 传递状态或属性以将值传递给react中的子组件

我还没有反应过来。我需要将验证是否成功传递给子react组件。下面是我的父组件

Login.js-Parent

update=name=>{
this.setState（{inputValidation:false}）//或使用es6 this.setState（{name}）
}
下一步单击=（）=>{
const{type，nicPassportNumber，accountNumner}=this.state；
如果（type==''）{//TODO在此处添加验证
警报（“请输入一个值以继续”）；
this.inputValidation=true；
这个.update（）；
log（“afetr:，this.inputValidation”）；
返回；
}
常量代码=类型=='nic密码'？nicPassportNumber:accountNumner；
此.props.verifyNumber（代码、类型）；
};
render（）{
const{nicPassportNumber，accountNumner}=this.state；
返回(
或
);

Input_Box.js-子组件

构造函数（道具）{
超级（道具）；
}
render（）{
const{label，value，onChangeFunc，type}=this.props；
log（“Val输入框：”，this.props.inputValidation）；
返回(
{label}
onChangeFunc（e，type）}/>
123214
);
}
}

我试过书中提出的大部分建议。但每次我在子组件中获得

输入验证的
未定义的

我做错了什么？
这个问题似乎是由于传递给
的道具不正确造成的：

希望这有帮助
 您尚未作为道具通过
inputValidation
。您传递了一个名为
valid
的prop，该prop似乎包含
inputValidation
。您的意思是使用此控制台日志未定义：
console.log（“Val输入框：”，this.props.inputValidation）
？@GlenK Yes，在子组件的console.log内部使用：
console.log（“Val输入框：”，this.props.valid）将“输入验证”作为“有效”道具传递
update = name => {
    this.setState({inputValidation:false})// or with es6 this.setState({name})
  }

  nextClick = () => {
    const {type, nicPassportNumber, accountNumner } = this.state;
    if(type === ''){ //TODO add validations here
      alert('please enter a value to proceed');
      this.inputValidation = true;
      this.update();
      console.log("afetr : ", this.inputValidation);
      return;
    }
    const code = type === 'nic-pass' ? nicPassportNumber : accountNumner;
    this.props.verifyNumber(code, type);
  };

  render() {
    const {nicPassportNumber, accountNumner} = this.state;
    return (
      <div className="container-fluid">
              <div className="row form-group">
                  <div className = "col-lg-10 col-xl-6 offset-xl-3 offset-lg-1">
                      <Input_Box label = "Enter NIC / Passport" value={nicPassportNumber} onChangeFunc={this.handleChange} valid = {this.state.inputValidation} type='nic-pass' {...this.props}/>
                      <h2 className="sc-txt-hor-center my-3">OR</h2>
                      <Input_Box label = "Enter mobile / DTV / Broadband number" value={accountNumner} onChangeFunc={this.handleChange} valid = {this.state.inputValidation} type='account' {...this.props}/>
                  </div>
              </div>
              <Footer onBackClick={this.backClick} onNextClick={this.nextClick}/>
      </div>
    );

constructor(props) {
        super(props);
    }


    render() {
        const {label, value, onChangeFunc, type} = this.props;
        console.log("Val input box : ", this.props.inputValidation);

        return (
            <div className="sc-input">
                <label className="sc-input__label mb-3" htmlFor="nic_passport_no">{label}</label>
                <input type="text" 
                    className="form-control sc-input__box" 
                    id="nic_passport_no" 
                    placeholder="" 
                    value={value} 
                    onChange={(e) => onChangeFunc(e, type)  }/>
                <label className="sc-input__error-msg">123214</label>
            </div>
        );
    }
}

{/* use inputValidation prop rather than valid prop */}
<Input_Box inputValidation={this.state.inputValidation} label="Enter NIC / Passport" value={nicPassportNumber} onChangeFunc={this.handleChange} type='nic-pass' {...this.props}/>

<h2 className="sc-txt-hor-center my-3">OR</h2>

{/* use inputValidation prop rather than valid prop */}
<Input_Box inputValidation={this.state.inputValidation} label="Enter mobile / DTV / Broadband number" value={accountNumner} onChangeFunc={this.handleChange}  type='account' {...this.props}/>

// console.log("afetr : ", this.inputValidation); 
console.log("after : ", this.state.inputValidation);