demo

$ npm install
$ npm run build

Component is build to

• CommonJS/UMD javascript module
• an ES6 javascript module

import Vue from 'vue';
import { VueAwesomeGrid } from 'vue-awesome-grid';

Vue.use(VueAwesomeGrid);

<template>
  <div>
    <!-- Too much code: -->
    <simple-component
      :g="1"
      :r="2"
      :i="3"
      :d="4">
    </simple-component>

    <!-- Do the same thing but simplier -->
    <simple-component v-bind="$data" />
  </div>
</template>
<script>
export default {
  data: () => ({
    g: '1',
    r: '2',
    i: '3',
    d: '4'
  });
}
</script>

And anything else you might need (this parameters must be implemented in backend).

Row that is located at the bottom of the table and shows additional resulting information about the data. By default, the summary row is not showing. To show it you must set it to object with similar structure, as the row in table.

Is used to pass additional properties to nested components. For example, you can pass bus object for events.

If the data of one row is updated and you don't need to update the whole data object, you can call ROW_UPDATED event to update only one row. You must pass one parameter to event with the folowing structure: { id: idValue, data: newRowData}.