有没有人遇到过这个问题哈！reack初尝试：Dom内容通过map遍历，useState应该如何应用才对呢？十分感谢

Question

dom内容通过map遍历，useState应该怎么写才不显得冗余又可以正确对上每个input的内容和事件呢？一开始试了对象去堆，但发现语法没对，一直报错/(ㄒoㄒ)/~~求指导
importReact,{useState,Fragment}from'react'
import{Input,Select,DatePicker,Col,Row}from'antd'
const{Option}=Select;
constsearchData=[
{
title:'商品名称',
type:1,
id:1
},
{
title:'商品品牌',
type:1,
id:2
},
{
title:'商品编号',
type:1,
id:3
},
{
title:'商家选择',
type:2,
id:5
},
{
title:'团队礼包',
type:2,
id:6
},
{
title:'创建日期',
type:3,
id:7
}
]
constGiftSearch=props=>{
constobj={
a1:[InputValue1,setInputValue1]=useState(''),
a2:[InputValue2,setInputValue2]=useState(''),
}
console.log(InputValue,'InputValue')
return(
{
searchData.map(item=>{
const{title,type,id}=item
return(
{title}：
{type===1&&`${setInputValue+id(e.target.value)}`}/>}
)
})
}
)
}
exportdefaultGiftSearch