需要帮助把按钮作为TableRowColumn在材料UI表!!我需要一个审批系统,以批准或拒绝用户的请求。我尝试这样做的表格形式。我想添加两个按钮“批准”和“拒绝”在TableRowColumn中由材料UI!!
这里的代码是:
const usersToRequest = [
{ name: 'Rahul', phone: '1234567890', from: 'sunday', to: 'saturday', roomType: 'Single Room' },
{ name: 'Hari', phone: '9876554423', from: 'monday', to: 'sunday', roomType: 'Double Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
{ name: 'Rohit', phone: '0909090987', from: 'tuesday', to: 'monday', roomType: 'Twin Room' },
];
<TableBody displayRowCheckbox={false} stripedRows>
{
usersToRequest.map((utr, i) => (
i < 4 ? <TableRow key={i}>
<TableRowColumn>{i + 1}</TableRowColumn>
<TableRowColumn>{utr.name}</TableRowColumn>
<TableRowColumn>{utr.phone}</TableRowColumn>
<TableRowColumn>{utr.roomType}</TableRowColumn>
<TableRowColumn>{utr.from}</TableRowColumn>
<TableRowColumn>{utr.to}</TableRowColumn>
<TableRowColumn>
{
<RaisedButton label="Approved" primary={true} onClick={console.log("!23")}/>
<RaisedButton label="Rejected" secondary={true} onClick={console.log("!23")}/>
}
</TableRowColumn>
</TableRow> : ''
))
}
</TableBody>
我在这里添加的按钮无法正常工作!!!
3条答案
按热度按时间wvyml7n51#
未正确绑定事件处理程序:试试这个:
7hiiyaii2#
RaisedButton是一个自定义组件,您将“onClick”作为prop传递给它,然后您必须在子组件中接受prop并在父组件中定义click函数。
ttp71kqs3#
这是一个使用mui的工作代码(material-ui新版本)
和凸起按钮必须定义如下:
我已经把那个凸起的按钮放在./DemoChild路径下的另一个文件中