unable to load Static data in vue-datatables-net

Question

I am trying to create a datatable in Vue 2 using vue-datatable-net@^1.6.0. But there was not enough information about its documentation or examples. I tried the github's README to create a basic sample with static data, but It does not work.

Below is the sample that I tried creating - sample-table.vue:

<template>
  <div class="row">
    <data-tables-net :dataLoader="tableData" :fields="tableColumns" />
  </div>
</template>
<script>
export default {
  data: function () {
    return {
      tableData: [
        { name: "Alice", age: 25 },
        { name: "Bob", age: 30 },
        { name: "Charlie", age: 20 },
        { name: "Dave", age: 35 },
      ],
      tableColumns: [
        { label: "Name", field: "name" },
        { label: "Age", field: "age" },
      ],
    };
  },
};
</script>

Note: The data-tables-net is already added to Vue.component.

The datatable is getting rendered with the provided columns but am unable to load the data. Kindly suggest some documentation or examples.