Integrating with VueJS

[mrarticuno]

I'm trying to integrate the TableSaw with vue, it's partially working I have to issues with it:

First: If I load the table after the page load (using IF conditional rendering) the tablesaw don't load and I can't init it "Tablesaw.init();" after mount the component.

Second: When I update the array that contains the objects that are showing up in the table the table do not refresh the rendering and only show's up correcly the initial data.

Anyway to solve that ?

On init:

After update table:

[zachleat]

Can you attach a reduced test case? It’s tough to debug from screenshots :)

[thedamon]

It sounds like tablesaw only evaluates tables that are present on load by default. I would create a TableSaw component and on its mounted hook run Tablesaw.init() on the specific table you want to saw.. You might need to call this again on any change to the data as well.. i'm not sure if that will be a problem with memory (calling init() over and over again without a destroy method).

Tablesaw looks to be written from a more allthedom approach so it might be tricky to use in a component system.. typically when integrating a non-vue script in a component we'd look for methods like create/destroy/update to call on the script itself to keep it in sync with the Vue data and properly dispose of it when it isn't needed anymore

[zachleat]

Probably a duplicate of https://github.com/filamentgroup/tablesaw/pull/345

[zachleat]

This is an automated message to let you know that this issue requires additional input from the original poster and for the health of the repository issue tracker the issue will be closed. This is to help alleviate issues hanging open waiting for a response from the original poster.

Do not let the issue’s closing deter you. After you’ve supplied the required information, the issue will be reopened. Thanks!