小编Ree*_*eon的帖子

- - Material-UI / React / Redux - -

我有一张material-ui桌子。每个内部都有<TableRow>一些<TableCell>具有自己<Chip>组件的组件。这些<Chip>组件通过label属性呈现文本。

我需要能够提取onClick处理程序内的标签，在我的例子中是chipFilter()函数。

我将使用该标签来过滤我的 redux 状态并为渲染表的较大组件返回新数据。

单击处理程序

chipFilter = () => {
     console.log(this)
     console.log(this.props)
     console.log(this.props.label)
}

组件渲染

表中呈现的每一行：

<TableRow key={n.id}>    
    <TableCell 
        component="th" 
        align="center"
        scope="row">
        <Chip 
            label={n.procedure} 
            variant="outlined" 
            color="primary"
            clickable={true}
            onClick={this.chipFilter} />
    </TableCell>

    <TableCell align="center">
        <Chip 
            label={n.doctor} 
            variant="outlined" 
            color="primary"
            clickable={true}
            onClick={this.chipFilter} />
    </TableCell>
        .
        .
        .
</TableRow>

谢谢您的帮助！！