我尝试了材质表,想在动作中添加一个菜单项,这样就不会显示太多编辑、删除等动作。我在显示菜单项时遇到问题。
示例代码:
<MaterialTable
columns={[
{ title: t('customer'), field: 'name' },
{ title: t('email'), field: 'email' },
{ title: t('contactNumber'), field: 'contactNumber' },
{ title: t('status'), field: 'status' },
]}
data={list}
options={{
headerStyle: {
backgroundColor: '#00b7b2',
},
toolbar: false,
}}
actions={[
{
icon: 'menu',
tooltip: 'Menu',
onClick: (event, rowData) => {
this.openMenu(event)
},
},
]}
components={{
Action: props => (
<div>
<IconButton
onClick={(event) => props.action.onClick(event, props.data)}
>
<Icon>menu</Icon>
</IconButton>
<Menu
anchorEl={this.anchorEl}
open={Boolean(this.anchorEl)}
onClick={event => event.stopPropagation()}
onSelect={event => event.stopPropagation()}
onClose={this.closeMenu}
>
<MenuItem> …Run Code Online (Sandbox Code Playgroud)