Как построить столбец из вложенных данных в SlimGrid (SlickGrid для Vue)?

Question

У меня есть такая структура данных:

{ 
  year: 1999,
  make: "ford",
  model: {
    name: "escort",
    type: {
      name: "wagon",
      id: 2
    }
}

И я хочу показать все атрибуты первого уровня (год, марка), а также вложенные атрибуты (model.name, model.type.name).

В SlimGrid есть определения столбцов, которые выглядят следующим образом:

columnOptions: {
  'year': {
    name: 'Car Year',
    order: 0,
    formatter (row,cell,value){
      return new Date(year);
    }
  }
}

model.name отлично работает со следующими параметрами:

'model': {
    name: 'Model Name',
    order: 2,
    formatter (row,cell,value){
      return value.name;
    }
  }

Поскольку model является атрибутом верхнего уровня.

Но , когда я пытаюсь построить новый столбец , который не имеет прямого эквивалента верхнего уровня, столбец не отображается:

'': {
  name: 'Type of Car',
  order: 3,
  formatter (row,cell,value){
    return this.tableData[row].model.type.name;
  }
}

Что у меня есть:

Car Year |  Make | Car Model
---------+-------+----------
    1999 |  ford |  escort

Что я хочу:

Car Year |  Make | Car Model | Type of Car
---------+-------+-----------+------------
    1999 |  ford |   escort  |    wagon

Как мне создатьдополнительный столбец в SlimGrid / SlickGrid, который не связан с атрибутом верхнего уровня?

Answer 1

Не знаю, как насчет SlimGrid, но я могу ответить за SlickGrid, по крайней мере, за текущий репо на https://github.com/6pac/SlickGrid.

Вы используете только первые несколько параметров вызова форматтера.Вся подпись:

 formatter(rowIndex, cellIndex, value, columnObject, rowObject, grid)

columnObject - это ваш columnOptions сверху.rowObject - это текущий объект строки - тот, на который вы ссылаетесь с помощью this.tableData[row].

. Он использует this.tableData[row], который не будет работать с SlickGrid (вместо этого используйте rowObject), но, опять же, это зависит от используемого вами репо.,Чтобы узнать, что представляет собой подпись вызова форматтера, выполните поиск result = getFormatter(row, m)(row, cell, value в файле slick.grid.js.