javascriptvue.jslodashag-grid-vue

Getting ag-grid's postSortRows to work with loadash's sortBy


I'm suing ag-grid-vue to work with a dataset and would like to get the rows to be grouped by a certain value of field status that I provide using an array with the order I want. So, following the docs, inside the created() hook I'm using:

created() {
  this.postSortRows = (params) => {
    var rowNodes = params.nodes;

    const order = ['Atrasado', 'Pendente', 'Pronto', 'Entregue'];

    rowNodes = _.sortBy(rowNodes, function(obj) {
      return _.indexOf(order, obj.data.status);
    });
  //prints an empty array AND the the desired sorted array.
  console.log(rowNodes);

  }

But the problem with this is that the _.sortBy function is behaving asynchronously and if I try to console.log the value of rowNodes after the assignment, it prints two times: enter image description here

But the rows keep unsorted.

From the docs, this piece of code works:

let nextInsertPos = 0;
for (let i = 0; i < rowNodes.length; i++) {
  const status = rowNodes[i].data.status;
  if (status === 'Atrasado') {
    rowNodes.splice(nextInsertPos, 0, rowNodes.splice(i, 1)[0]);
    nextInsertPos++;
  }
}

I checked the lodash docs and it doesn't say that the return value of the _.sortBy function is asynchronous, but it also does not say the opposite. I already tried to wrap the contents of the created hook inside another function and using a second argument as callback function, but it doesn't work either. Is there anything special to get this working? Any help appreciated.


Solution

  • Found out that the problems was in the assignment I was making to the ag-grid variable holding rowNodes. Solved by, instead of directly assigning the value of sortBy, using Object.assign:

    const sorted = _.sortBy(rowNodes, function(obj) {
      const val =  _.indexOf(order, obj.data.status);
      return _.indexOf(order, obj.data.status);
    });
    Object.assign(rowNodes, sorted);