如何使用高级表格的后台排序功能

操作场景

后台排序必须和全局变量一起配合使用。后台分页、后台排序和后台筛选同时启用时，在添加转换器时，需要先筛选、再排序、最后分页，如图1。

图1 转换器添加顺序

后台排序

1. 参考登录华为云Astro大屏应用界面中操作，登录华为云Astro大屏应用界面。
2. 新建后台排序转换器。
   1. 在主菜单中，选择“数据中心”。
   2. 在左侧导航栏中，选择“转换器 > 全部”，单击“新建转换器”。
   3. 输入转换器名称和分类，单击“确定”。
   4. 输入转换器代码，单击“保存”。

      let data = [...dataset];
      
      const sortType = $pageStore.sortType;
      const sortField = $pageStore.sortField;
      
      if (sortType && sortField) {
          if (sortType == 'ascending') {
              data.sort((a, b) => {
                  return isNaN(Number(a[sortField])) ? b[sortField].localeCompare(a[sortField]) : b[sortField] - a[sortField];
              });
          } else {
              data.sort((a, b) => {
                  return isNaN(Number(a[sortField])) ? a[sortField].localeCompare(b[sortField]) : a[sortField] - b[sortField];
              });
          }
      }
      
      return data

3. 新建一个大屏页面，从“全部组件 > 文本”中，拖拽“高级表格”组件至画布空白区域。
4. 开启后台排序功能。
   图2 开启后台排序
   

5. 新建全局变量。
   后台排序需要搭配全局变量使用，请创建sortType、sortField。

   图3 新建排序全局变量。
   

6. 交互设置。
   1. 选中高级表格组件，单击，进行组件交互设置。
   2. 添加“点击排序时”交互动作。
      图4 点击排序时交互动作
      

7. 设置组件数据源。
   1. 选中组件，单击组件上方的。
   2. 选择所需的数据类型。
   3. 在全局变量配置下方，单击“+”，选择转换器，添加2创建的转换器。
      图5 添加转换器
      
   4. 在组件预览中，将表格中的字段，拖拽到对应的配置中。
      图6 拖拽字段到对应配置中
      
   5. 单击“保存”，完成组件数据源的配置。

8. 保存页面，预览效果。
   图7 查看后台排序效果