AG-Grid Concat 字段答案

【问题标题】：AG-Grid Concat fieldsAG-Grid Concat 字段
【发布时间】：2022-01-18 14:35:34
【问题描述】：

我正在尝试连接 AG Grid 中的多个字段。这是可行的，但当该字段为空白时，网格显示未定义。

请参阅下面的代码。我有一个网格，其中包含学生的名字、中间名和姓氏。但是，当中间名为空时，连接值的“学生”字段会将中间名显示为未定义。

this.state = {
      modules: AllCommunityModules,
      columnDefs: [
        {
          field:"FirstName",
          headerName: "FirstName",
        },

        {
          field: "MiddleName",
          header: "MiddleName",
        },

        {
          field: "LastName",
          header: "LastName",
        },

        {
          field: "Student",
          header: "Student",
          valueGetter: studentValueGetter,
        },

function studentValueGetter(params) {
  return params.data.FirstName + params.data.MiddleName + params.data.LastName;
}

A header	Another header	A header	Another header
John	Pete	Smith	JohnPeteSmith
Sarah		Jane	SarahunderfinedJane

【问题讨论】：

标签： ag-grid ag-grid-react

【解决方案1】：

只需在中间名上添加一个条件：

return params.data.FirstName + ' ' +
  (params.data.MiddleName ? params.data.MiddleName + ' ' : '') +
  params.data.LastName;

或者用更高级的语法做同样的事情：

const { FirstName, MiddleName, LastName } = params.data;
return [FirstName, MiddleName, LastName].filter(n => !!n).join(' ');

虽然不是 ag-grid 特定的东西；这通常是 JavaScript。

【讨论】：