glittershark / reactable

Fast, flexible, and simple data tables in React
glittershark.github.io/reactable
MIT License
1.51k stars 222 forks source link

The only possible children of <Table> are <Thead>, <Tr>, or one <Tfoot>. #320

Closed squll1 closed 7 years ago

squll1 commented 8 years ago

try to use the Tr component in the Table Component.

// PlayerList Component (PlayerList.js)
<Table className="player-list">
              {
                players.map((data, i) => {
                  return (
                    <PlayerItem data={data}/>
                  )
                })
              }
</Table>
// PlayerItem Component (PlayerItem.js)
import React from 'react';
import {Table, Thead, Tr, Th, Td} from 'reactable';

class PlayerItem extends React.Component {
  render() {
    return (
      <Tr key={this.props.data.id}>
        <Td column="Name">{this.props.data.name}</Td><Td column="Age">{this.props.data.age}</Td>
      </Tr>
    );
  }
}

export default PlayerItem;

'The only possible children of <Table> are <Thead>, <Tr>, or one <Tfoot>.' With the above message is output list is not rendered.

ryanbelt commented 8 years ago

got the same problem

kinyat commented 7 years ago

Same here. It would be good to accept the example above :)

glittershark commented 7 years ago

see #196