Filter

Facade APIHas Paid PlanUniver ServerUniver on Node.jsPreset
--UniverSheetsFilterPreset

The filter plugin provides filtering functionality for cells.

This feature includes the following plugin packages:

Presets Installation

import { createUniver, defaultTheme, LocaleType, merge } from '@univerjs/presets';
import { UniverSheetsCorePreset } from '@univerjs/presets/preset-sheets-core';
import UniverPresetSheetsCoreEnUS from '@univerjs/presets/preset-sheets-core/locales/en-US';
import { UniverSheetsFilterPreset } from '@univerjs/presets/preset-sheets-filter';
import UniverPresetSheetsFilterEnUS from '@univerjs/presets/preset-sheets-filter/locales/en-US';
 
import '@univerjs/presets/lib/styles/preset-sheets-core.css'
import '@univerjs/presets/lib/styles/preset-sheets-filter.css'
 
const { univerAPI } = createUniver({
  locale: LocaleType.EN_US,
  locales: {
    [LocaleType.EN_US]: merge(
      {},
      UniverPresetSheetsCoreEnUS,
      UniverPresetSheetsFilterEnUS
    ),
  },
  theme: defaultTheme,
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsFilterPreset(),
  ],
});

Piecemeal Installation

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 SheetsFilterUIEnUS from '@univerjs/sheets-filter-ui/locale/en-US';
 
import '@univerjs/sheets-filter-ui/lib/index.css';
 
import '@univerjs/sheets-filter/facade';
 
const univer = new Univer({
  theme: defaultTheme,
  locale: LocaleType.en_US,
  locales: {
    [LocaleType.en_US]: merge(
      SheetsFilterUIEnUS
    ),
  },
});
 
univer.registerPlugin(UniverSheetsFilterPlugin);
univer.registerPlugin(UniverSheetsFilterUIPlugin);

Univer on Node.js Piecemeal Installation

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

To get full defination of facade api, please refer to FacadeAPI

Get Filter

Returns an FFilter object, or null if the sheet has no filter.

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);

Create Filter

Create an FFilter object asynchronously, and return null if the sheet already has a filter.

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);

Was this page helpful?