# 排序

- Human documentation: [https://docs.univer.ai/zh-TW/guides/sheets/features/sort](https://docs.univer.ai/zh-TW/guides/sheets/features/sort)

- Agent Markdown: [https://docs.univer.ai/zh-TW/guides/sheets/features/sort.md](https://docs.univer.ai/zh-TW/guides/sheets/features/sort.md)

- Requested language: `zh-TW`

- Content language: `zh-TW`

- Documentation version: `1.2.0`

- Source: [sheets/features/sort.zh-TW.mdx](https://github.com/dream-num/documentation/blob/dev/content/guides/sheets/features/sort.zh-TW.mdx)

---

#### Package metadata

```json
{
  "mobile": true,
  "preset": [
    {
      "client": "@univerjs/preset-sheets-sort",
      "locale": "@univerjs/preset-sheets-sort/locales/zh-TW",
      "style": "@univerjs/preset-sheets-sort/lib/index.css"
    }
  ],
  "plugins": [
    {
      "client": "@univerjs/sheets-sort",
      "facade": "@univerjs/sheets-sort/facade"
    },
    {
      "client": "@univerjs/sheets-sort-ui",
      "locale": "@univerjs/sheets-sort-ui/locale/zh-TW",
      "style": "@univerjs/sheets-sort-ui/lib/index.css"
    }
  ],
  "headless": true,
  "license": false,
  "server": false
}
```

排序功能允許使用者對電子表格中的資料進行排序，以便更好地組織和分析資訊。它支援多種排序方式，包括升序、降序和自訂排序，幫助使用者快速找到所需資料。



## 外掛模式

### 安裝

#### npm

```bash
npm install @univerjs/sheets-sort @univerjs/sheets-sort-ui
```

#### pnpm

```bash
pnpm add @univerjs/sheets-sort @univerjs/sheets-sort-ui
```

#### yarn

```bash
yarn add @univerjs/sheets-sort @univerjs/sheets-sort-ui
```

#### bun

```bash
bun add @univerjs/sheets-sort @univerjs/sheets-sort-ui
```

### 使用

```typescript
import { LocaleType, mergeLocales, Univer } from '@univerjs/core'
import { UniverSheetsSortPlugin } from '@univerjs/sheets-sort' // [!code ++]
import { UniverSheetsSortUIPlugin } from '@univerjs/sheets-sort-ui' // [!code ++]
import SheetsSortUIZhTW from '@univerjs/sheets-sort-ui/locale/zh-TW' // [!code ++]

import '@univerjs/sheets-sort-ui/lib/index.css' // [!code ++]

import '@univerjs/sheets-sort/facade' // [!code ++]

const univer = new Univer({
  locale: LocaleType.ZH_TW,
  locales: {
    [LocaleType.ZH_TW]: mergeLocales(
      SheetsSortUIZhTW, // [!code ++]
    ),
  },
})

univer.registerPlugin(UniverSheetsSortPlugin) // [!code ++]
univer.registerPlugin(UniverSheetsSortUIPlugin) // [!code ++]
```

## 行動裝置支援

先設定[行動版編輯器](https://docs.univer.ai/zh-TW/guides/sheets/getting-started/installation.md#mobile-support)。在本頁外掛模式的初始化程式碼中，將下列桌面版註冊替換為同一套件匯出的行動版外掛，並在**開啟文件前**完成。保留模型外掛、樣式、語言套件與 Facade 匯入，請勿同時註冊兩個版本。

| 套件                         | 桌面版註冊                      | 行動版註冊                            |
| -------------------------- | -------------------------- | -------------------------------- |
| `@univerjs/sheets-sort-ui` | `UniverSheetsSortUIPlugin` | `UniverSheetsSortMobileUIPlugin` |

## 預設模式

### 安裝

#### npm

```bash
npm install @univerjs/preset-sheets-sort
```

#### pnpm

```bash
pnpm add @univerjs/preset-sheets-sort
```

#### yarn

```bash
yarn add @univerjs/preset-sheets-sort
```

#### bun

```bash
bun add @univerjs/preset-sheets-sort
```

### 使用

```typescript
import { UniverSheetsCorePreset } from '@univerjs/preset-sheets-core'
import UniverPresetSheetsCoreZhTW from '@univerjs/preset-sheets-core/locales/zh-TW'
import { UniverSheetsSortPreset } from '@univerjs/preset-sheets-sort' // [!code ++]
import UniverPresetSheetsSortZhTW from '@univerjs/preset-sheets-sort/locales/zh-TW' // [!code ++]
import { createUniver, LocaleType, mergeLocales } from '@univerjs/presets'

import '@univerjs/preset-sheets-core/lib/index.css'
import '@univerjs/preset-sheets-sort/lib/index.css' // [!code ++]

const { univerAPI } = createUniver({
  locale: LocaleType.ZH_TW,
  locales: {
    [LocaleType.ZH_TW]: mergeLocales(
      UniverPresetSheetsCoreZhTW,
      UniverPresetSheetsSortZhTW, // [!code ++]
    ),
  },
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsSortPreset(), // [!code ++]
  ],
})
```

## Facade API

完整 Facade API 型別定義，請檢視 [FacadeAPI](https://docs.univer.ai/zh-TW/reference/facade/univer.md)

### 引入

> [!INFO: 外掛模式提示]
> 僅外掛模式需要手動引入 Facade 套件。預設模式已內建對應的 Facade 套件，無需額外引入。

```typescript
import '@univerjs/sheets-sort/facade'
```

### 工作表排序

[`FWorksheet.sort(colIndex, asc)`](https://docs.univer.ai/zh-TW/reference/facade/worksheet.md#sort) 方法可以按指定的列對工作表進行排序。

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// 按照第一列升序排序工作表
fWorksheet.sort(0)

// 按照第一列降序排序工作表
fWorksheet.sort(0, false)
```

### 區域排序

[`FRange.sort(column)`](https://docs.univer.ai/zh-TW/reference/facade/range.md#sort) 方法可以按指定的列和順序對給定範圍內的單元格進行排序。

```typescript
const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const fRange = fWorksheet.getRange('D1:G10')

// 按照第一列升序排序區域
fRange.sort(0)

// 按照第一列降序排序區域
fRange.sort({ column: 0, ascending: false })

// 按照第一列降序，第二列升序排序區域
fRange.sort([{ column: 0, ascending: false }, 1])
```

### 事件監聽

完整事件型別定義，請檢視 [Events](https://docs.univer.ai/zh-TW/reference/facade/events.md)。

`SheetRangeSorted` 事件在單元格範圍排序完成後觸發。

```typescript
const disposable = univerAPI.addEvent(univerAPI.Event.SheetRangeSorted, (params) => {
  const { workbook, worksheet, range, sortColumn } = params
})

// 移除事件監聽器，使用 `disposable.dispose()`
```

`SheetBeforeRangeSort` 事件在單元格範圍排序前觸發。

```typescript
const disposable = univerAPI.addEvent(univerAPI.Event.SheetBeforeRangeSort, (params) => {
  const { workbook, worksheet, range, sortColumn } = params

  // 取消排序操作
  params.cancel = true
})

// 移除事件監聽器，使用 `disposable.dispose()`
```