🎉 v0.5.4 版本已发布。查看详情 →
指南Univer Sheets功能筛选

筛选

Facade API可付费升级需要 Univer 服务端Univer on Node.jsPreset
✅--✅UniverSheetsFilterPreset

筛选插件提供了对单元格的筛选功能。

该功能包含以下插件包：

Presets 安装

import { createUniver, defaultTheme, LocaleType, merge } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreZhCN from '@univerjs/presets/preset-sheets-core/locales/zh-CN';
import { UniverSheetsFilterPreset } from '@univerjs/presets/preset-sheets-filter';
import UniverPresetSheetsFilterZhCN from '@univerjs/presets/preset-sheets-filter/locales/zh-CN';
 
import '@univerjs/presets/lib/styles/preset-sheets-core.css'
import '@univerjs/presets/lib/styles/preset-sheets-filter.css'
 
const { univerAPI } = createUniver({
  locale: LocaleType.ZH_CN,
  locales: {
    [LocaleType.ZH_CN]: merge(
      {},
      UniverPresetSheetsCoreZhCN,
      UniverPresetSheetsFilterZhCN 
    ),
  },
  theme: defaultTheme,
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsFilterPreset(),
  ],
});

手动组合安装

npm install @univerjs/sheets-filter @univerjs/sheets-filter-ui
import { LocaleType, merge, Univer } from '@univerjs/core';
import { defaultTheme } from "@univerjs/design";
import { UniverSheetsFilterPlugin } from '@univerjs/sheets-filter';
import { UniverSheetsFilterUIPlugin } from '@univerjs/sheets-filter-ui';
import SheetsFilterUIZhCN from '@univerjs/sheets-filter-ui/locale/zh-CN';
 
import '@univerjs/sheets-filter-ui/lib/index.css';
 
import '@univerjs/sheets-filter/facade';
 
const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.ZH_CN,
  locales: {
    [LocaleType.ZH_CN]: merge(
      SheetsFilterUIZhCN
    ),
  },
});
 
univer.registerPlugin(UniverSheetsFilterPlugin);
univer.registerPlugin(UniverSheetsFilterUIPlugin);

Univer on Node.js 手动组合安装

npm install @univerjs/sheets-filter
import { LocaleType, Univer } from '@univerjs/core';
import { defaultTheme } from "@univerjs/design";
import { UniverSheetsFilterPlugin } from '@univerjs/sheets-filter';
 
import '@univerjs/sheets-filter/facade';
 
const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.ZH_CN,
});
 
univer.registerPlugin(UniverSheetsFilterPlugin);

Facade API

完整 facade api 类型定义，请查看 FacadeAPI

获取筛选器

返回一个 FFilter 对象，若 sheet 没有筛选器，则返回 null。

const sheet = univerAPI.getActiveWorkbook().getActiveSheet();
 
// get filter from FWorksheet
const filter = sheet.getFilter();
console.log(filter);
 
// get filter from FRange
const range = sheet.getRange(0, 0, 10, 10);
const filter = range.getFilter();
console.log(filter);

创建筛选器

异步创建一个 FFilter 对象，若 sheet 已经有筛选器，则返回 null。

const sheet = univerAPI.getActiveWorkbook().getActiveSheet();
 
// get range
const range = sheet.getRange(0, 0, 10, 10);
 
// create filter, if filter is already created in worksheet, it will return null
let filter = await range.createFilter();
 
// so delete the existing filter before creating a new one
if (!filter) {
  await sheet.getFilter().remove();
 
  // create filter again
  filter = await range.createFilter();
}
 
console.log(filter);

参考链接

范围主题排序
这个页面对您有帮助吗？