-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Table with default sortable header hides arrow icon #2850
Comments
I should think about it, probably with a prop because it's a breaking change |
Just as an extra data point, I'm currently upgrading from Buefy v0.8.17 to v0.9.3 and also ran into this issue. Using v0.8.17, I was using the following
after upgrading to v0.9.3, the template had to change a bit due to the breaking changes in the v0.9.0 release, but in addition the sort arrows are no longer shown when the column is selected:
I've looked over the Buefy release notes for the v0.9.x releases and didn't see any mention of the removal of the sort arrows when using a custom header template, so to me this seems like a breaking change. If the decision is made to not add the arrows back in, perhaps something could be added to the documentation showing how to add them back in manually inside the custom template, if that's even possible. |
I have the same problem (described by nwidger): in 0.9.4, sort arrow are not displayed if we use custom header template. There is no mention in the doc regarding how to re-create these arrows. |
Does someone have a workaround for this? I think the easiest way would be to get sort direction from buefy to display me own sort icon? |
I used custom-sort on the column I want sorted. The function has an "isAsc" parameter, I used that to set a data variable in my component. Then I can show my own icon depending on that data variable. |
That's a nice workaround. I'd have preferred a way to do it without relying an a side effect, but given there's no builtin solution in Buefy, your way seems the best atm, so thank you :) |
Closing because #3940 should have fixed this issue. If you happen to be able to reproduce this issue with the latest version of Buefy please reopen this issue. Thank You! |
Hello there,
I see this: Checking the HTML created for the headers and comparing it with the previous one that uses no custom header, I can see that the span tag that should hold the arrows is missing from the generated content: I tried to reproduce with the codepen from the current Buefy documentation (B-Table # Custom headers) and in this case not only the arrows are not displayed but the sorting does not even work. You can see it here: https://codepen.io/Verdoso/pen/wvZLvvm?editors=101&layout=right where I just added sortable to the 'First name' column. Cheers! |
Overview of the problem
Buefy version: [0.9.2]
Vuejs version: [2.6.11]
OS/Browser: Chrome 85
Description
Buefy Table with custom header and sortable prop hides
Steps to reproduce
Define a table with a custom header and sortable
Sort the column
Notice the arrow not being shown
Expected behavior
I'd expect the table to have the custom header and maintaining the sort arrow.
Actual behavior
Example:
![Screenshot 2020-09-03 at 18 18 35](https://user-images.githubusercontent.com/17337794/92146787-1eb19d00-ee12-11ea-8773-4643cdaf3cd5.png)
Sort on Identifier column:
Sort on ID column:
![Screenshot 2020-09-03 at 18 21 33](https://user-images.githubusercontent.com/17337794/92146902-4dc80e80-ee12-11ea-9b5f-7abf2de94e23.png)
The text was updated successfully, but these errors were encountered: