# 並べ替え

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

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

- Requested language: `ja-JP`

- Content language: `ja-JP`

- Documentation version: `1.1.0`

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

---

#### Package metadata

```json
{
  "mobile": true,
  "preset": [
    {
      "client": "@univerjs/preset-sheets-sort",
      "locale": "@univerjs/preset-sheets-sort/locales/ja-JP",
      "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/ja-JP",
      "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 SheetsSortUIJaJP from '@univerjs/sheets-sort-ui/locale/ja-JP' // [!code ++]

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

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

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

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

## モバイル対応

まず[モバイルエディター](https://docs.univer.ai/ja-JP/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 UniverPresetSheetsCoreJaJP from '@univerjs/preset-sheets-core/locales/ja-JP'
import { UniverSheetsSortPreset } from '@univerjs/preset-sheets-sort' // [!code ++]
import UniverPresetSheetsSortJaJP from '@univerjs/preset-sheets-sort/locales/ja-JP' // [!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.JA_JP,
  locales: {
    [LocaleType.JA_JP]: mergeLocales(
      UniverPresetSheetsCoreJaJP,
      UniverPresetSheetsSortJaJP, // [!code ++]
    ),
  },
  presets: [
    UniverSheetsCorePreset(),
    UniverSheetsSortPreset(), // [!code ++]
  ],
})
```

## Facade API

Facade API の完全な型定義は、[FacadeAPI](https://docs.univer.ai/ja-JP/reference/facade/univer.md) を参照してください。

### インポート

> [!INFO: プラグインモード注意]
> Facade パッケージの手動 import が必要なのはプラグインモードのみです。プリセットモードには対応する Facade パッケージが内蔵されているため、追加の import は不要です。

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

### ワークシートの並べ替え

[`FWorksheet.sort(colIndex, asc)`](https://docs.univer.ai/ja-JP/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/ja-JP/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/ja-JP/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()` を使用します。
```