Javascript 反应：将提交的数据从一个组件传递到另一个组件

对于react Dapp，我需要将从一个组件提交的数据发送到另一个组件（需要数据的函数所在的位置）

因此，我想将在Master.jsx中的表单上提交的数据发送到App.js（

createKit

）：

Master.jsx：

class Master extends Component {
  handleInputChange = (event) => {
    let input = event.target;
    let name = event.target.name;
    let value = input.value;
    this.setState({
      [name]: value
    });
  };
  render() {
    return (
      <Fragment>
        <form className="addForm" onSubmit={createKit}>
            <span>Barcode:</span>
            <input name="barcode" className="barcorde" type="number" 
             onChange={this.handleInputChange}/>
            <span>Owner</span>
            <input name="owner" className="owner" type="text"        
             onChange={this.handleInputChange}/>
            <span>Inventory</span>
            <input name="inventory" className="inventory" type="text" 
             onChange={this.handleInputChange}/>
          <button type="submit" value="submit">Add kit</button>
        </form>
      </Fragment>
    );
  }
}
export default withRouter(Master);

类主控扩展组件{
handleInputChange=（事件）=>{
让输入=event.target；
让name=event.target.name；
设value=input.value；
这是我的国家({
[名称]：值
});
};
render（）{
返回(
条形码：
所有者
库存
添加套件
);
}
}
使用路由器（主设备）导出默认值；

App.js：

class App extends Component {
  state = {barcode: null, owner: "", inventory: ""};

  createKit = (event) => {
    event.preventDefault();
    const cBarcode = this.state.barcode;
    const cOwner = this.state.owner;
    const cInventory = this.state.inventory;
    console.log(cBarcode, cOwner, cInventory);
  };
  render() {
    return (
      <div className="App">
        <Router>
          <Switch>
            <Route path="/login"><Login /></Route>
            <ProtectedRoute path="/home"><Dashboard /> </ProtectedRoute>
            <Route exact path="/"><Redirect exact from="/" to="home" /></Route>
            <Route path="*"><Redirect from="/" to="home" /></Route>
          </Switch>
        </Router>
      </div>
    );
  }
}
export default App;
export const createKit = (event) => {
  event.preventDefault();
  const cBarcode = this.state.barcode;
  const cOwner = this.state.owner;
  const cInventory = this.state.inventory;
  console.log(cBarcode, cOwner, cInventory);
};

类应用程序扩展组件{
状态={条形码：空，所有者：，库存：}；
createKit=（事件）=>{
event.preventDefault（）；
const cBarcode=this.state.barcode；
const cOwner=this.state.owner；
const cInventory=this.state.inventory；
控制台日志（cBarcode、cOwner、cInventory）；
};
render（）{
返回(
);
}
}
导出默认应用程序；
导出常量createKit=（事件）=>{
event.preventDefault（）；
const cBarcode=this.state.barcode；
const cOwner=this.state.owner；
const cInventory=this.state.inventory；
控制台日志（cBarcode、cOwner、cInventory）；
};

我还为我的代码创建了一个沙盒：

我试图在

道具中查看我的状态，但没有成功：/

我提前感谢任何愿意花时间帮助我的人