获取 React 中按钮的类别 ID答案

【问题标题】：Get the Category ID of a button in React获取 React 中按钮的类别 ID
【发布时间】：2021-07-04 07:11:32
【问题描述】：

我试图通过单击一个按钮来获取类别 ID 的值，但是当我单击其中一个按钮时它会获取我的类别的所有 ID。

    const CategoryPage = ({ categories }) => {
  const classes = useStyles()

  const [click, setClick] = useState()

  const handleClick = (e) => {
    e.preventDefault()
    const id = categories.map((category) => category._id)
    console.log(id)
  }

  return (
    <div className={classes.scrollMenu}>
      {categories.map((category) => {
        return (
          <Button
            key={category._id}
            className={classes.button}
            onClick={(e) => handleClick(e)}
          >
            {category.name}
          </Button>
        )
      })}
    </div>
  )
}

【问题讨论】：

标签： reactjs react-router react-hooks

【解决方案1】：

您可以将category.id 作为参数传递给调用者函数。

const CategoryPage = ({ categories }) => {
const classes = useStyles()

const [click, setClick] = useState()

const handleClick = (categoryId) => { // clicked category id
    e.preventDefault()
    console.log(categoryId)
}

return (
    <div className={classes.scrollMenu}>
       {categories.map((category) => {
          return (
             <Button
                key={category._id}
                className={classes.button}
                onClick={() => handleClick(category._id)} // this way
             >
             {category.name}
             </Button>
         )
       })}
   </div>
 )
}

【讨论】：