diff --git a/package.json b/package.json index 9ce24851f..301e131f3 100644 --- a/package.json +++ b/package.json @@ -69,6 +69,8 @@ }, "dependencies": { "classnames": "^2.1.2", + "lodash.get": "^4.4.2", + "lodash.set": "^4.3.2", "prop-types": "^15.5.10", "react-modal": "^3.0.3", "react-s-alert": "^1.3.2" diff --git a/src/TableBody.js b/src/TableBody.js index 1c35a5feb..a1c234f2d 100644 --- a/src/TableBody.js +++ b/src/TableBody.js @@ -7,6 +7,7 @@ import TableColumn from './TableColumn'; import TableEditColumn from './TableEditColumn'; import classSet from 'classnames'; import ExpandComponent from './ExpandComponent'; +import _get from 'lodash.get'; class TableBody extends Component { constructor(props) { @@ -55,7 +56,7 @@ class TableBody extends Component { let tableRows = this.props.data.map(function(data, r) { const tableColumns = this.props.columns.filter(_ => _ != null).map(function(column, i) { - const fieldValue = data[column.name]; + const fieldValue = _get(data, column.name); const isFocusCell = r === y && i === x; if (column.name !== this.props.keyField && // Key field can't be edit column.editable && // column is editable? default is true, user can set it false diff --git a/src/store/TableDataStore.js b/src/store/TableDataStore.js index c10757012..ecac2a591 100644 --- a/src/store/TableDataStore.js +++ b/src/store/TableDataStore.js @@ -4,6 +4,8 @@ /* eslint eqeqeq: 0 */ /* eslint one-var: 0 */ import Const from '../Const'; +import _get from 'lodash.get'; +import _set from 'lodash.set'; export class TableDataStore { @@ -193,10 +195,10 @@ export class TableDataStore { const currentDisplayData = this.getCurrentDisplayData(); let rowKeyCache; if (!this.enablePagination) { - currentDisplayData[rowIndex][fieldName] = newVal; + _set(currentDisplayData[rowIndex], fieldName, newVal); rowKeyCache = currentDisplayData[rowIndex][this.keyField]; } else { - currentDisplayData[this.pageObj.start + rowIndex][fieldName] = newVal; + _set(currentDisplayData[this.pageObj.start + rowIndex], fieldName, newVal); rowKeyCache = currentDisplayData[this.pageObj.start + rowIndex][this.keyField]; } if (this.isOnFilter) { @@ -470,8 +472,8 @@ export class TableDataStore { let valid = true; let filterVal; for (const key in filterObj) { - let targetVal = row[key]; - if (targetVal === null || targetVal === undefined) { + let targetVal = _get(row, key, ''); + if (targetVal === null) { targetVal = ''; } @@ -519,9 +521,9 @@ export class TableDataStore { formatExtraData = this.colInfos[key].formatExtraData; filterValue = this.colInfos[key].filterValue; if (filterFormatted && format) { - targetVal = format(row[key], row, formatExtraData, r); + targetVal = format(targetVal, row, formatExtraData, r); } else if (filterValue) { - targetVal = filterValue(row[key], row); + targetVal = filterValue(targetVal, row); } } @@ -606,13 +608,11 @@ export class TableDataStore { filterValue, formatExtraData } = colInfo; - let targetVal; + let targetVal = _get(row, key); if (filterFormatted && format) { - targetVal = format(row[key], row, formatExtraData, r); + targetVal = format(targetVal, row, formatExtraData, r); } else if (filterValue) { - targetVal = filterValue(row[key], row); - } else { - targetVal = row[key]; + targetVal = filterValue(targetVal, row); } if (targetVal !== null && typeof targetVal !== 'undefined') { targetVal = targetVal.toString().toLowerCase(); @@ -658,8 +658,8 @@ export class TableDataStore { if (sortFunc) { result = sortFunc(a, b, sortDetails.order, sortDetails.sortField, sortFuncExtraData); } else { - const valueA = a[sortDetails.sortField] == null ? '' : a[sortDetails.sortField]; - const valueB = b[sortDetails.sortField] == null ? '' : b[sortDetails.sortField]; + const valueA = _get(a, sortDetails.sortField, ''); + const valueB = _get(b, sortDetails.sortField, ''); if (isDesc) { if (typeof valueB === 'string') { diff --git a/yarn.lock b/yarn.lock index 77c9514fa..19fc46bf9 100644 --- a/yarn.lock +++ b/yarn.lock @@ -4646,6 +4646,10 @@ lodash.escape@~2.4.1: lodash._reunescapedhtml "~2.4.1" lodash.keys "~2.4.1" +lodash.get@^4.4.2: + version "4.4.2" + resolved "https://registry.yarnpkg.com/lodash.get/-/lodash.get-4.4.2.tgz#2d177f652fa31e939b4438d5341499dfa3825e99" + lodash.isarguments@^3.0.0: version "3.1.0" resolved "https://registry.yarnpkg.com/lodash.isarguments/-/lodash.isarguments-3.1.0.tgz#2f573d85c6a24289ff00663b491c1d338ff3458a" @@ -4752,6 +4756,10 @@ lodash.restparam@^3.0.0: version "3.6.1" resolved "https://registry.yarnpkg.com/lodash.restparam/-/lodash.restparam-3.6.1.tgz#936a4e309ef330a7645ed4145986c85ae5b20805" +lodash.set@^4.3.2: + version "4.3.2" + resolved "https://registry.yarnpkg.com/lodash.set/-/lodash.set-4.3.2.tgz#d8757b1da807dde24816b0d6a84bea1a76230b23" + lodash.template@^2.4.1: version "2.4.1" resolved "https://registry.yarnpkg.com/lodash.template/-/lodash.template-2.4.1.tgz#9e611007edf629129a974ab3c48b817b3e1cf20d"