Way to stop b-table from re-sorting immediately on data update?

Describe the bug question

I’m using the b-table component and its built-in sorting functionality.

In each row of my data, I’m using slots to insert a checkbox, which the user can click to select or deselect the row and associated data (I chose this over the native “select row” functionality for reasons). I’ve added the ability to sort by this column using a custom compare function bound to the :sort-compare prop, allowing the table to bring all the checked rows to the top (or bottom). The problem is that if the user checks/ unchecks a row while sorted this way, the row instantly gets re-sorted, and jumps elsewhere in the table, which is very undesirable.

My question is this: Is there a way to prevent instant re-sorting, and only re-sort when the user changes the sort (when sort-changed fires)? Or do I need to implement manual sorting to make this happen?

Versions

Libraries:

• BootstrapVue: 2.11.0
• Bootstrap: 4.4.1
• Vue: 2.6.11

Environment:

• Device: PC
• OS: Windows 10
• Browser: Chrome
• Version: 85.0.4183.102

[zcoop98]

Feel like it’s worth mentioning that by now I just went ahead and disabled sorting with the no-local-sorting prop, and pulled the custom sort routine that I already wrote for sort-compare into my own sort function. I tied this to the @sort-changed event, and got the desired effect: sorting only happens when you click the header, and doesn’t immediately change with edited data.

It would still be nice to be able to set a boolean prop for this behavior however, as I personally didn’t at all expect the immediate-re-sort behavior that’s default. In my experience, most tables I’ve interacted with don’t seem to do that; immediate re-sorting here felt jarring and unexpected.

[rizen]

Thank you to @zcoop98 for the idea on how to fix this, and I agree that it should just be a local option.