carbon-design-system / carbon-components-vue

Vue implementation of the Carbon Design System
http://vue.carbondesignsystem.com
Apache License 2.0
606 stars 178 forks source link

Unexpected behaviour in CvDataTable component with pagination #1287

Open remo285 opened 2 years ago

remo285 commented 2 years ago

Detailed description

I have found an unexpected or unintended behaviour using the CvDataTable component, with pagination.

When using the data table with pagination, the event.start property starts at 1, wich if used to slice a data array will slice away the first element.

I found this to be unexpected or unintended behavior because i have found that this is also present on the Storybook examples for the CvDataTable component.

To fix this on my end i just did this on my slice function.

return filteredData.slice(
        this.pageStart - 1,
        this.pageStart - 1 + this.pageLength
      )

If this is indeed unexpected behavior, maybe a good fix will be to just make the event.start property start at 0 instead of 1, which would make this functionality straightforward to use.

If this was the intended behavior, then just look at this as an issue for the storybook documentation haha.

Steps to reproduce the issue

To see this issue simply go to https://vue.carbondesignsystem.com/?path=/story/components-cvdatatable--default and see that the data array used has 15 elements and the table only shows 14.

Additional information

Data array with 15 elements image

Elements shown by the data table image

davidnixon commented 10 months ago

I agree this is an issue but not sure its fixable now. If we change the start page now to 0 it will break existing code. The current storybook does not show the pagination control but one option would be to add a story for it and show your working code above.

Do you want to add a story for it in the Vue 3 storybook?

github-actions[bot] commented 2 months ago

This issue has been marked as stale because it has required additional info or a response from the author for over 14 days. When you get the chance, please comment with the additional info requested. Otherwise, this issue will be closed in 14 days.