在 Goldenlayout 中使用 Slickgrid Dataview

Question

我可以在 GoldenLayout 中使用带有普通网格的 Slickgrid。

但是，我正在尝试实现数据视图，但遇到了 onRowCountChanged.subscribe 事件的问题：

var StockGridComponent = function (container, state) {

  this._dataView = new Slick.Data.DataView();

  this._container = container;
  this._state = state;
  this._grid = null;
  this._columns = [...];
  this._data = data;
  container.on('open', this._createGrid, this);

};

StockGridComponent.prototype._createGrid = function () {

  this._grid = new Slick.Grid(
    this._container.getElement(),
    this._dataView,
    this._columns,
    this._options
  );

  this._grid.setSelectionModel(new Slick.CellSelectionModel());

  this._dataView.onRowCountChanged.subscribe(function (e, args) {
    console.log(this);   <-- return DataView
    this._grid.updateRowCount();  <-- error: "Uncaught TypeError: Cannot read property 'updateRowCount' of undefined"
    this._grid.render();
  }
);

我想我的问题是我不知道如何引用对象的 _grid 对象（我不精通Javascript）。

任何将 Goldenlayout 与 SlickGrid Dataview 一起使用的人都可以分享他们如何创建 SlickGrid 组件吗？

谢谢。

Answer 1

对我来说似乎更像是一个上下文问题。在 _createGrid 方法中，在变量中定义外部 this 的上下文并使用它。喜欢

StockGridComponent.prototype._createGrid = function () {

  this._grid = new Slick.Grid(
    this._container.getElement(),
    this._dataView,
    this._columns,
    this._options
  );

  this._grid.setSelectionModel(new Slick.CellSelectionModel());
  var self = this; // store the context and use later

  this._dataView.onRowCountChanged.subscribe(function (e, args) {
    console.log(this);   <-- this here will refer to context of callback method
    self._grid.updateRowCount();
    self._grid.render();
  }
);

希望这能解决问题。

在 Goldenlayout 中使用 Slickgrid Dataview

Using Slickgrid Dataview in Goldenlayout

javascript

slickgrid

golden-layout