Javascript 子组件使用onChange（），更新父组件

我有三个组件，一个控制器和这个控制器的两个孩子。 对于这个问题，我们需要一个控制器和一个子系统（他的名字是：Input.js）

所以，我揭露了这个问题。在我的

Input.js

中，我调用了

onChange（）

方法，并在该文件中更新了状态，在我的控制器中，我传递了一个道具，用于恢复我孩子的状态

但是我有一个错误

this.props.myName不是一个函数

请您查看下面的代码：

**Input.js**

import React，{Component，Fragment}来自“React”；
类输入扩展组件{
建造师（道具）{
超级（道具）；
控制台日志（道具）；
此.state={
电邮：“，
密码：“
};
_手柄更换（pEvt）{
if（pEvt.target.type==“email”&&pEvt.target.value.length>=6）{
这是我的国家({
电子邮件：pEvt.target.value
});
}否则{
这是我的国家({
密码：pEvt.target.value
});
}
}
render（）{
const{type，placeholder}=this.props；
返回(
（this.refInput=input）}
onChange={pEvt=>{
本手册（pEvt）；
}}
/>
);
}
}
导出默认输入

在您的实现中，
符号
类不知道
输入
类的
值
输入类可以在没有状态的情况下实现
setState
不应使用自身进行更新，您可以使用
prevState
，但在这种情况下不需要
Fragement
不做任何事情，因此它不需要在那里，因为它已经有了一个
div
包装器

下面是一个基于您的代码的示例：

class Input extends Component {
  _handleChange = event => {
    this.props.onChang(event.target.value);
  }

  render() {
    const { type, placeholder, value } = this.props;
    return (
      <div className="form__group">
        <input
          className="form__input"
          type={type}
          placeholder={placeholder}
          onChange={this._handleChange}
          value={value}
        />
      </div>
    );
  }
}

class SighUp extends Component {
  state = {
    email: '',
    password: '',
  };

  render() {
    return (
        <form>
          <Input
            type="email"
            placeholder="Email"
            value={this.state.email}
            onChang={val => { this.setState({ email: val }); }}
          />
          <Input
            type="password"
            placeholder="Password"
            value={this.state.password}
            onChang={val => { this.setState({ password: val }); }}
          />
          <button onClick={e => { e.preventDefault(); console.log(this.state); }}>Console log</button>
        </form>
    );
  }
}

类输入扩展组件{
_handleChange=事件=>{
this.props.onChang（event.target.value）；
}
render（）{
const{type，placeholder，value}=this.props；
返回(
);
}
}
类SighUp扩展组件{
状态={
电子邮件：“”，
密码：“”，
};
render（）{
返回(
{this.setState（{email:val}）；}
/>
{this.setState（{password:val}）；}
/>
{e.preventDefault（）；console.log（this.state）；}}>控制台日志
);
}
}

此演示有一个codesandbox：

这个演示有用吗？
我无法从您的代码中找出您在哪里使用inputValue，它没有显示在输入组件中。也许你错过了一些代码？可能是重复的谢谢你的回答：）享受吧！