reactjs - 将表单提交数据作为 props 传递给本地 JS 文件中定义的另一个函数

Question

对不起，如果问题是基本的，因为我是初学者。所以我有一个这样的 form.js 文件：

import React, {useState} from 'react';

function Submit() {

    const [inputField , setInputField] = useState({
        first_name: ''
    })
   
    const inputsHandler = (e) =>{
        setInputField( {[e.target.name]: e.target.value} )
    }

    const submitButton = () =>{
        alert(inputField.first_name)

    }
    return (
        <div>
            <input 
            type="text" 
            name="first_name" 
            onChange={inputsHandler} 
            placeholder="enter the organism id" 
            value={inputField.first_name}/> //this is my prop value!
            <button onClick={submitButton}>Submit Now</button> 
        </div>
    )
}

export default Submit

我想将输入值作为道具传递给保存在名为 Nav.js 的文件中的另一个函数。

function NAV() {
  return (
 <Router>
      <Navbar />
      <Switch>
        <Route path='/' exact component={Home} />
        <Route path='/jbrowse/jbrowse' render={(props) => <View {...props} id={} />}/>

我想将输入值添加到 id。我非常需要你的帮助，因为我是一个绝对的初学者并且必须赶上最后期限。

标签： reactjsreact-propsreact-forms