Javascript 如何解决将select的值传递给服务器的问题？

我有一个应用程序。在这个应用程序中，我有一个页面，上面有我从本地服务器获得的图像类别列表，还有第二个页面，上面有帖子。我还创建了一个

表单

，在本地服务器中添加新帖子。在这个表单中，我有四个

输入

：（

标题

，

类别id

，

说明

，

图像

）

在输入

category\u id

中，我写入类别的编号

id

。但现在我需要的不是

input

，而是

select

和category的标题，我使用API方法

get

从服务器上获取。我试图做出这样的选择

但是我的服务器响应错误：

类别识别码是必需的 这是因为：

• 我传递给服务器

  标题

  类别，但我应该传递

  Id

  类别。标题应该是show usnamepost in

  select

  ，但我将

  id

  传递给服务器
• 组件

  SelectCategory

  与

  FormData

  不相关。因此，选择的值

  SelectCategory

  不会出现在

  FormData

  中，也不会出现在

  body

  方法

  handleSubmit

  中

如何解决这个问题？

---

serever的回复（我在

const data

中获得的类别列表）： AddPost.js：

const AddPost=（）=>{
const formRef=useRef（）；
const[category，setCategory]=useState（“”）；//您必须发送category_id，现在存储的只是标题

您还必须存储id

async function fetchData() {
  const data = await api(`${listRoute}`, {  method: 'GET'});
  setCategories(data.data); // Change here
}

然后在
选择类别
组件中：

export default (props) => {
    return (
      <div>
        <select onChange={props.upadateSelectCategory} value={props.value}>
          <option value="">-- Category --</option>
          {props.categories.map(item => <option value={item.id} key={item.id}>{item.title}</option>)}  
        </select> 
      </div>
  );}

另外，服务器响应错误：
Category\u id现在在FormData中是必需的
：但它必须是这样的：也就是说，component SelectCategory与
FormData
不相关，非常感谢！
export default (props) => {
    return (
      <div>
        <select onChange={props.upadateSelectCategory} value={props.value}>
          <option value="">-- Category --</option>
          {props.categories.map(item => <option key={item}>{item}</option>)}  
        </select> 
      </div>
  );}

async function fetchData() {
  const data = await api(`${listRoute}`, {  method: 'GET'});
  setCategories(data.data); // Change here
}

export default (props) => {
    return (
      <div>
        <select onChange={props.upadateSelectCategory} value={props.value}>
          <option value="">-- Category --</option>
          {props.categories.map(item => <option value={item.id} key={item.id}>{item.title}</option>)}  
        </select> 
      </div>
  );}

data.append('category_id', category)