How to integrate QTable with server side OData?

[Jason0514]

For example:
Specify data-source in template:

  <QTable :data-source="dataSource" ... ></QTable>

And define data-source in js:

  dataSource: {
        store: {
          type: 'odata',
          url: 'https://js.devexpress.com/Demos/DevAV/odata/Products'
        },
        select: [
          'Product_ID',
          'Product_Name',
          'Product_Cost',
          'Product_Sale_Price',
          'Product_Retail_Price',
          'Product_Current_Inventory'
        ],
        filter: ['Product_Current_Inventory', '>', 0]
      }

After that, all the page navigation and sort is automatically sync to server side.

[metalsadman]

@Jason0514 read about https://quasar.dev/vue-components/table#Server-side-pagination%2C-filter-and-sorting, then check the example https://quasar.dev/vue-components/table#Example--Synchronizing-with-server.

[Jason0514]

@metalsadman Thanks for your reply.

I know how to use server side data processing. My question is: I don’t want to do all those coding every time. I want to extend current QTable component, which can support OData data source directly.
So that I can just specify an OData data source on component and all sort and pagination will working, no more code is needed.

I have read source code of QTable, I know it is using Mixin to support sort and pagination, is it possible to extent those Mixin to support OData?

[metalsadman]

you can extend QTable, that’s the essence of Vue components, it’s the devs task how to extend the component for what needs they want to use it to.