Change/update/edit data programmatically

Since I am moving over from another company products I have the need to read the grid row by row, take the value that is in a cell add that value to a web api call to a totally different company, get the results back as a JSON object and parse it to take out the elements that I need and write it back to the same row but a different cell.  The other grid I was using allowed me to 

methods:{      GetRows:function(){        alert('The row data count is : '+ this.$refs.grid.$el.ej2_instances[0].currentViewData.length);      },      Setcell:function(){        this.$refs.grid.$el.ej2_instances[0].setCellValue(this.$refs.grid.$el.ej2_instances[0].currentViewData[0].OrderID,'CustomerID','Changed value');        alert("changed the first row's second cell value");      }    }

Thank you for the sample and I make a few changes and saved it at https://next.plnkr.co/edit/WrLOKIofeTDN2gow I added paging and it seems that I can only get and set to visible rows- is that correct?   I tried to read more documentation on paging at https://ej2.syncfusion.com/vue/documentation/api/grid/#pagesettings-pagesettingsmodel but that seems to be a bad page  -- How would I read the current page settings (in a function) then set the items per page to All-  then I'd run the process-- and after the process is done reset the items per page to the way it was?

paging:function(args){        if(this.$refs.grid.$el.ej2_instances[0].allowPaging){         this.$refs.grid.$el.ej2_instances[0].allowPaging = false;        }        else{          this.$refs.grid.$el.ej2_instances[0].allowPaging = true;        }      },