Javascript 按desc、asc排序功能

我有一个带有列数组和数据数组的表组件。我需要对列进行排序并更新表的表状态。我的方法从列接收两个参数key（columns key）和sortable（true或false columns sortable或not），我搞砸了什么？对表列进行排序的最佳解决方案是什么？如何使其简单，并按数字和字符串排序

const columns = [
    {
        key: 'deviceType',
        label:'Device Type',
        numeric: false,
    }, {
        key: 'deviceID',
        label:'Device ID',
        sortable: true,
        numeric: true,
        // cellRenderer: ({item, key}) =>
        //          <Button >Default</Button>,
    }, {
        key: 'name',
        label: 'Name',
        sortable: false,
        numeric: false,

    },{
        key: 'currentVersion',
        label: 'Current Version',
        sortable: false,
        numeric: false,
    },{
        key: 'location',
        label: 'Location',
        sortable: false,
        numeric: false,
    },{
        key: 'status',
        label: 'Status',
        sortable: false,
        numeric: false,
    },{
        key: 'lastAliveMessage',
        label: 'Last alive message',
        sortable: false,
        numeric: false,
    }, {
        key: 'action',
        label: 'Actions',
        cellRenderer: () => <SimpleMenu />,
    }]

const data = [
    { key: 1, deviceType: 'Tag', deviceID: 1, name:'Tag For sending an ', location: 'Room_104', status: 'assigned'},
    { key: 2, deviceType: 'Tag', deviceID: 2, name:'Tag For sending an ', location: 'Room_104', status: 'assigned'},
    { key: 3, deviceType: 'Tag', deviceID: 3, name:'Tag For sending an ', location: 'Room_104', status: 'assigned'},
    { key: 4, deviceType: 'Tag', deviceID: 4, name:'Tag For sending an ', location: 'Room_104', status: 'assigned'},
    { key: 5, deviceType: 'Tag', deviceID: 5, name:'Tag For sending an ', location: 'Room_104', status: 'assigned'},
]

class EnhancedTable extends Component {
    state = {
        selected: [],
        data,
        order: 'asc',
        search: '',
    }

    handleRequestSort = (key, sortable) => {
        let order = 'desc'

        // if (this.state.order.by === key && this.state.order.direction === 'desc') {
        //     order = 'asc'
        // }
        if (sortable && this.state.order.direction === 'desc') {
            order = 'asc'
        }
        const data = this.state.data.sort(
            (a, b) => {
                order === 'desc' ? b[key] > a[key] : a[key] > b[key]},
        )

        this.setState({ data, order })
    }

const列=[
{
键：“deviceType”，
标签：'设备类型'，
数字：false，
}, {
键：“deviceID”，
标签：'Device ID'，
可排序：是的，
数字：对，
//cellRenderer:（{item，key}）=>
//违约，
}, {
关键字：“名称”，
标签：“名称”，
可排序：false，
数字：false，
},{
键：“当前版本”，
标签：“当前版本”，
可排序：false，
数字：false，
},{
键：'位置'，
标签：'位置'，
可排序：false，
数字：false，
},{
关键字：“状态”，
标签：“状态”，
可排序：false，
数字：false，
},{
键：“lastAliveMessage”，
标签：“最后一条活动消息”，
可排序：false，
数字：false，
}, {
关键：“行动”，
标签：“行动”，
cellRenderer:（）=>，
}]
常数数据=[
{键：1，设备类型：'Tag'，设备ID:1，名称：'Tag For sending an'，位置：'Room_104'，状态：'assigned'}，
{键：2，设备类型：'Tag'，设备ID:2，名称：'Tag For sending an'，位置：'Room_104'，状态：'assigned'}，
{键：3，设备类型：'Tag'，设备ID:3，名称：'Tag For sending an'，位置：'Room_104'，状态：'assigned'}，
{键：4，设备类型：'Tag'，设备ID:4，名称：'Tag For sending an'，位置：'Room_104'，状态：'assigned'}，
{键：5，设备类型：'Tag'，设备ID:5，名称：'Tag For sending an'，位置：'Room_104'，状态：'assigned'}，
]
类增强可扩展组件{
状态={
选定：[]，
数据，
订单：“asc”，
搜索：“”，
}
HandlerRequestSort=（键，可排序）=>{
让order='desc'
//if（this.state.order.by==key&&this.state.order.direction===desc'）{
//订单='asc'
// }
if（可排序（&this.state.order.direction==='desc'）{
订单='asc'
}
const data=this.state.data.sort(
（a，b）=>{
顺序=='desc'？b[键]>a[键]：a[键]>b[键]}，
)
this.setState（{data，order}）
}

排序

执行就地数组修改。您忘记返回

const data = this.state.data.slice()
data.sort(
            (a, b) => {
                return order === 'desc' ? b[key] > a[key] : a[key] > b[key]
            },
        )

或删除

{}

 data.sort(
   (a, b) => (order === 'desc' ? b[key] > a[key] : a[key] > b[key]),
 )

---

sort

进行就地数组修改。您忘记返回了

const data = this.state.data.slice()
data.sort(
            (a, b) => {
                return order === 'desc' ? b[key] > a[key] : a[key] > b[key]
            },
        )

或删除

{}

 data.sort(
   (a, b) => (order === 'desc' ? b[key] > a[key] : a[key] > b[key]),
 )

---

事实上，是的，它可以工作，按它排序只有一次，第二次点击（触发器）没有更新我找到的数据谢谢，我没有一个好的条件应该是如果（sortable&&this.state.order=='desc'）{order='asc'}@PalaniichukDmytro你可以像这样切换方向。

const order={asc:'desc，desc'asc'}[this.state.order]

的确，是的，它可以工作，按它排序只有一次，第二次点击（触发器）没有更新我找到的数据，谢谢，我没有一个好的条件应该是if（sortable&&this.state.order=='desc'）{order='asc'}@PalaniichukDmytro你可以像这样切换方向。

const order={asc:'desc[this.state.order]

可能值得一提，期望得到的不是

true

或

false

，而是小于零的值、零或大于零的值。可能值得一提的是，期望得到的不是

true

或

false

，而是小于零的值、零或大于零的值。