Question

我对VueJS相当陌生，目前正在使用BootstrapVue（最新版本，v2.0.0），主要是其b表功能。我动态地（从JSON文件中）加载表项，并且我的一个字段（列）是一个字符串，另一个是格式化日期（dd / MM / YYYY）。我希望能够像其他字符串或数字字段一样对那些日期进行排序。该文档提到了可能性to create custom sorting function，所以我写了一个（作为全局函数，按照建议使用moment.js）：

function sortDate(a, b, key) {
  aDate = moment(a[key], 'DD/MM/YYYY')
  bDate = moment(b[key], 'DD/MM/YYYY')
  if (aDate.isValid && bDate.isValid) {
    if (aDate < bDate) {
      return -1
    }
    else if (aDate > bDate) {
      return 1
    }
    else {
      return 0
    }
  }
  return null
}

然后我使用：sort-compare标记将其集成到HTML b表中：

<b-table id="bh_table" :items="items" :fields="fields" :sort-compare="sortDate"></b-table>

问题在于regulat字符串排序已损坏，我不确定如何解决？我应该创建一个可以检测列类型并进行相应排序的全局方法吗？

这似乎是要做的事情，但我认为这很违反直觉，可能会重复（我还有另一个表，其中包含数字和日期，仅包含日期等）

Answer 1

您不检查正在排序的键。另外请注意a和b是整个行数据。

function sortDate(a, b, key) {
  if (key !== 'myDateField') {
    // `key` is not the field that is a date.
    // Let b-table handle the sorting for other columns
    // returning null or false will tell b-table to fall back to it's
    // internal sort compare routine for fields keys other than `myDateField`
    return null // or false
  }
  aDate = moment(a[key], 'DD/MM/YYYY')
  bDate = moment(b[key], 'DD/MM/YYYY')
  if (aDate.isValid && bDate.isValid) {
    if (aDate < bDate) {
      return -1
    }
    else if (aDate > bDate) {
      return 1
    }
    else {
      return 0
    }
  }
  return null
}

BootstrapVue表：按日期和字符串排序？

1 个答案: