Javascript 如何从React Js中的组件获取父文件中的输入文本框值

我想在全局级别创建一个输入类型，因此我创建了一个组件，并希望从另一个文件访问它。 这里有一个例子

主文件：

class User extends Component {

    constructor(props) {
        super(props);
    }
    render(){
       return (
                <CustomInput 
                    refval = "username"
                    label = "Username"
                    classNameLabel = "pl0"
                    icon = "person"
                />
       );
    }
}

类用户扩展组件{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
);
}
}

组件文件：

class CustomInput extends React.Component {
    constructor(props) {
        super(props);
    }
    render() {
      return (
          <div className="col-sm-3 mt10">
            <label className={"col-sm-12 "+this.props.classNameLabel}>{this.props.label}</label>
            <div className="col-sm-12 pl0">
                {(this.props.icon!=="" && 
                  <i className={"fa fa-"+this.props.icon+""}></i>
                )}
                <input type={this.props.type} ref={this.props.refval} className="form-control inputText" />
            </div>
          </div>
      );
    }
}

类CustomInput扩展React.Component{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
{this.props.label}
{（这个.props.icon！==“”&&
)}
);
}
}

我怎样才能存档？

---

提前非常感谢：）

一种方法是向下传递函数，如下所示：

class User extends Component {
    constructor(props) {
        super(props);
    }

    const onClick =(e) => { /// do stuff}
    render(){
    return (
        <CustomInput 
        refval = "username"
        label = "Username"
        classNameLabel = "pl0"
        icon = "person" onClick={onClick} />
    }}
}  

类用户扩展组件{
建造师（道具）{
超级（道具）；
}
const onClick=（e）=>{///do stuff}
render（）{
返回(
}}
}  

通过道具访问回调

class CustomInput extends React.Component {
        constructor(props) {
            super(props);
        }
        render() {
            return (
                    <input type={this.props.type} onClick={props.OnClick} />
                </div>
                </div>
            );
        }
    }

类CustomInput扩展React.Component{
建造师（道具）{
超级（道具）；
}
render（）{
返回(
);
}
}

---

更好的方法可能是查看挂钩和访问全局用户状态。另一个技巧是，您可以将这些组件作为功能组件而不是类组件编写。

您好，本文应该帮助您添加一个类似onKeyDown的事件，这意味着当您键入某个内容并按enter键时，您可以启动一个函数，然后在那里您可以获得值和在props中传递它或使用redux。查看此stackoverflow帖子。这说明了如何将函数从父级传递到子级，以及如何从子级检索数据。