作为函数参数的数据集属性

Question

是否可以将数据集属性用作函数参数？我希望当我单击按钮启动editCategory函数并将其作为数据id中的id参数传递时。谢谢

function printCategory(category: CategoryType){
return(
<tr>
<td>{category.categoryId}</td>
<td>{category.name}</td>
<th><Button variant="secondary" size="sm" data-id={category.categoryId} onClick={()=>editCategory()}>Edit</Button></th>
</tr>
)
}

Answer 1

更简单的方法：

onClick={e => editCategory(e.target.getAttribute('data-id'))}

useRef方法：

const editButtonRef = React.useRef()

然后在按钮的标记中：

onClick={() => editCategory(editButtonRef.getAttribute('data-id'))}

请注意，这种方法可能会消耗更多内存，作为最后手段