Question

我在最新版本的Material UI中使用了Table组件，我不确定当它被选中时我应该如何从Table的行中获取数据。

该文档提到了名为onRowSelection的Table组件的prop，但它只为您选择的行提供了RowNumber，没有其他内容。

你怎么能完全使用它？我不明白你是怎么想抓住说的......设置为TableRow的关键道具只使用同一个TableRow的RowNumber道具。

下面的代码显示了我如何呈现表本身，并分配键：

handleSelect(id) {
  console.log(id);
  this.props.dispatch({ type: 'SET_SELECTED_USER', user: id });
}

renderUsers() {
  if (this.props.users && this.props.currentUser) {
    const currUser = this.props.currentUser.username;
    const userList = this.props.users.map((user) => {
      if (currUser !== user.username) {
        return (
          <TableRow key={user._id}>
            <TableRowColumn>{user.username}</TableRowColumn>
            <TableRowColumn>{user.roles[0]}</TableRowColumn>
          </TableRow>
        );
      }
    });
    return userList;
  }
}

我只是不明白所选行的RowNumber应该如何帮助我，当我需要访问它们的行键时。

任何帮助都会非常感激！谢谢！

表格文档：http://www.material-ui.com/#/components/table

Answer 1

您可以将行号用作users数组中的索引（this.props.users）：

handleSelect(userIndex) {
  const currUser = this.props.currentUser.username;
  const users = this.props.users.filter(user => user.username !== currUser)
  this.props.dispatch({ type: 'SET_SELECTED_USER', user: users[userIndex].id });
}

从Material UI中的TableRow组件获取数据

1 个答案: