我如何禁用一个按钮在react钩子有一个setState函数已经在onClick?

Question

我试图禁用一个已经有一个useState用于增加喜欢的按钮。我想在点击按钮后禁用它。我将感激你的帮助。谢谢你！

const allItems = [
{
id: 1,
name: "The Rise and Decline of Patriarchal Systems",
image: "https://img.thriftbooks.com/api/images/i/m/8ECA8C9BAF351D13622ADFFBFA8A5D4E2BAABAFF.jpg",
likes: 3359,
price: 1
}
]
const Shop = () => {
const [items, setItems] = React.useState({allItems, disable: false})
const updateLike = (item) =>   setItems(items.map(indItem => {
if (indItem !== item) {
return indItem
} 
else {
return {...item, likes: item.likes + 1}
}

}))
const listItemsToBuy = () => items.map((item) => (
<div key={item.id} className="card"></div>
<div className="font-text"><h2>{`${item.name}`}</h2>
</div>
<h2>Likes: {item.likes}</h2>
<div>
<button items={items} onClick={()=> updateLike(item, true)}> Like </button>
));```

Answer 1

内部updateLike函数更新你的状态

setItems(prevState => { ...prevState, disable: true, })

那么你的按钮将看起来像

<button disabled={items.disabled} >

但是最好有单独的状态