Выберите строку в datatable (mui-datatable) - PullRequest
Новая
       20

Выберите строку в datatable (mui-datatable)

0 голосов
/ 02 мая 2019

Я пытаюсь использовать таблицы из mui-datatable. Это работает нормально, но когда я пытаюсь выбрать строку за пределами флажка де, это не работает. Мне нужно, чтобы это работало как таблицы из материала-дизайна.

Я видел, что у них есть функция для выбора строки, и она работает в режиме консоли, поэтому ... Мне нужен код, чтобы поместить его внутрь и добавить строку к выбранным строкам. 

const columns = ["Id","Description"];
const options = {
  filterType: 'checkbox',
  responsive: 'scroll',
  onRowClick: (rowData, rowState) => {

    //What can I add here?
    console.log(rowData, rowState);
  },
};

class PersonList extends React.Component{
    state = {
        persons: [],
        data: [],
    }; 
    componentDidMount() {

        axios.get(`my url`)
          .then(res => {
            const persons = res.data;
            const data = [];
            persons.map(x => data.push({ 'Id': x.id, 'Description' : x.Description}));           
            this.setState({ data });

          })
      }
render(){
    return(
        <Container>
            <Page pagetitle="Exemplo" history={this.props.history}>

            <MUIDataTable
                title={"My Table"}
                data={this.state.data}
                columns={columns}
                options={options}
            />
            </Page>
        </Container>
    )
}}
export default(PersonList);

1 Ответ

1 голос
/ 12 июня 2019

Теперь это возможно с опциями первичной таблицы в версии 2.4.0. 

const options = {
  selectableRows: true,
  selectableRowsOnClick: true
};

Добавление selectableRowsOnClick: true к опциям таблицы позволит щелкнуть в любом месте строки, чтобы зарегистрироваться в качестве действия выбора,так же, как если бы флажок был установлен.

...