[Component] [table] Sortable El-Table

[leeobrum]

Bug Type: Component

Environment

• Vue Version: 3.4.24
• Element Plus Version: 2.7.1
• Browser / OS: Edge
• Build Tool: Vite

Reproduction

Related Component

• el-table

Reproduction Link

Element Plus Playground

Steps to reproduce

use sortable

What is Expected?

order correctly

What is actually happening?

The function is ordering wrong

Additional comments

Maybe I don't know how to do it, but I wasted some time on this and couldn't solve it.

[zeyongTsai]

The comparison of magnitude between strings is different from numbers. If you expect numerical magnitude ordering, please convert them to numbers before making the comparison.

[leeobrum]

@zeyongTsai I understood
but, I will show numbers in the field and I will need to show string when the field is empty, that's the problem.

In the example below I transform it into int, but not all actions don't work

Element Plus Playground

[adapt0]

Couple of things to keep in mind:

• el-table can sort the data for you (see sort-method), no need to mutate your data directly (don't use data.value.sort)
• similarly el-table handles ascending/descending order, no need to mutate data for that either
• sort comparison function argument order is not guaranteed. Consider compareFunction('333', 'Never Realized')

Here's an updated example which uses sort-method, will sort the mixture of strings & numbers, and doesn't mutate the data:
Element Plus Playground

[leeobrum]

@adapt0 you helped me a lot, thank you!! xd