ag-Grid / Reactjs - Как получить значение ячейки в columnDefs - PullRequest
0 голосов
/ 22 февраля 2019

Я использую таблицу ag-Grid в приложении Reactjs, фрагмент моего кода можно увидеть ниже:

const columnsDef = [
  .
  .
  {
    headerName: 'Side',
    field: UI_FIELDS.SIDE,
    width: 70,
    cellRenderer: sideRenderer,
    cellRendererParams: {
      value: "BUY"
    }
  },
  .
  .
]

function sideRenderer(params) {
  const value = _.get(params, 'value') || '';
  const styleSuffix = _.isEmpty(value) ? 'default' : value.toLowerCase();

  return `<span class="side-renderer side-renderer-${styleSuffix}">${value}</span>`;
}

Я жестко закодировал value: "BUY" в моем cellRendererParams на данный момент, ноЯ хочу, чтобы это было на самом деле равным тому, что находится в этой ячейке для этого столбца, который может быть либо BUY, либо SELL.

Это значение влияет на то, какая css применяется к тексту, значение BUY будет окрашено в зеленый цвет, а значение Sell будет окрашено в красный цвет.

Как установить value равным фактическому тексту в ячейке, а не жестко закодировать, как это?

Ответы [ 2 ]

0 голосов
/ 22 февраля 2019

Спасибо 'A Ghanima' за упоминание об использовании params.value, это помогло мне найти следующее решение, которое работает

{
  headerName: 'Side',
  field: UI_FIELDS.SIDE,
  width: 70,
  cellRenderer: sideRenderer,
  cellRendererParams: (params) => { value: params.value }
}
0 голосов
/ 22 февраля 2019

Вы можете сделать что-то вроде этого

const columnsDef = [
  {
    headerName: 'Side',
    field: UI_FIELDS.SIDE,
    width: 70,
    cellRenderer: (params) => params.value.toLowerCase() === 'buy' ? `<span class="side-renderer side-renderer-buy">${params.value}</span>`  : `<span class="side-renderer side-renderer-sell">${params.value}</span>
  }
]

Я думаю, это то, что вы хотите?Если нет, объясните более подробно, что вам нужно.

Редактировать: вам не нужно передавать параметры визуализации ячейки, вы можете получить значение ячейки, используя params.value

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