SlickGrid: флажок выбора строк в React - PullRequest
0 голосов
/ 28 января 2020

Я пытаюсь SlickGrid Checkbox Выбор строки в React с использованием пакета slickgrid-es6 . Вот пример исходного кода этого в Jquery.

Я изменил тот же код в React Es6. Но я не могу увидеть флажок здесь.

JS код:

import {Grid, Data, Plugins} from 'slickgrid-es6';
import './styles.scss';

import data from "../example-data";

let columns = [];

let CheckboxSelectColumn = Plugins.CheckboxSelectColumn;
let RowSelectionModel = Plugins.RowSelectionModel;

var checkboxSelector = new CheckboxSelectColumn({
  cssClass: "slick-cell-checkboxsel"
});

columns.push(checkboxSelector.getColumnDefinition());

const newcolumns = [
  { id: "title", name: "Title", field: "title", maxWidth: 100, minWidth: 80 },
  { id: "duration", name: "Duration", field: "duration", resizable: false },
  { id: "%", name: "% Complete", field: "percentComplete" },
  { id: "start", name: "Start", field: "start" },
  { id: "finish", name: "Finish", field: "finish" },
  { id: "effort-driven", name: "Effort Driven", field: "effortDriven" }
];

columns = [columns, ...newcolumns];

console.log(columns);

const options = {
  enableCellNavigation: true,
  enableColumnReorder: true,
  forceFitColumns: true,
  frozenColumn: 0,
  frozenRow: 1
};

const dataView = new Data.DataView();
dataView.setItems([ ...data ]); // some data


export default () => {
  let grid =  new Grid("#myGrid", dataView, columns, options);
  grid.setSelectionModel(
    new RowSelectionModel({ selectActiveRow: false })
  );

  grid.registerPlugin(checkboxSelector);

  return grid;
};

стили. css,

@import '../scss/slick.grid.variables.scss';
@import '../scss/slick.grid.scss';
@import '../scss/slick-default-theme.scss';
@import '~flatpickr/dist/flatpickr.min.css';

.slick-cell-checkboxsel {
    background: #f0f0f0;
    border-right-color: silver;
    border-right-style: solid;
}

Любые идеи?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...