Filter
Facade API | Has Paid Plan | Univer Server | Univer on Node.js | Preset |
---|---|---|---|---|
✅ | - | - | ✅ | UniverSheetsFilterPreset |
The filter plugin provides filtering functionality for cells.
This feature includes the following plugin packages:
@univerjs/sheets-filter
- Filter Plugin@univerjs/sheets-filter-ui
- Filter UI Plugin
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.
getFilter()
on theFWorksheet
objectgetFilter()
on theFRange
object
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.
createFilter()
on theFRange
object
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);