仅更改 State şin React

如何解决仅更改 State şin React

我只想更改在 React 中有 2 项的状态中的一项。这是代码。

//İnitial
const initialState ={
  status:"",gender:""
}
//Creating State
const [searchTerm,setSearchTerm]=useState(initialState);

//Callback function in select on change
const setStatusFilter=(event)=>{
setSearchTerm(prev=>(
{
  status:event.target.value,...prev.gender
}))
}

const setGenderFilter=(event)=>{
setSearchTerm(prev=>(
{
    ...prev.status,gender:event.target.value

}))

}

我使用这个状态来获取 API。但是当我更改其中一个时，另一个变得未定义，但它必须是以前的值。所以 fetch 被破坏了。我不明白为什么会这样。

解决方法

直接在 prev 上使用扩展运算符，然后只需添加您要更新的其他字段。

setSearchTerm(prev => ({...prev,status: event.target.value}))

您试图传播 ...prev.status，但 status 只是一个字符串值，而不是一个对象。