# 如何在 Visual Studio Code 正確啟用「資料行選取模式」(區塊選取模式)

我之前有在[我的 YouTube 頻道](https://www.youtube.com/@Will_Huang)發佈過一部《[示範 VS Code 強大的多重游標編輯能力](https://youtu.be/aMdct4G3W1I)》影片，當時有提到「資料行選取模式」(Column Selection Mode) 的功能，但是沒有特別說明如何正確啟用這個功能。重點是，我自己每次要找這個啟用的設定都要找個老半天，因為 VSCode 會自動同步設定，只要登入就會自動復原，而我上次調整這個設定已經是很多很多年前的事了。我為什麼還要找這個設定呢？因為有上課的學員會來問我，但我每次都找不到！所以我決定寫一篇文章來記錄這個設定。

![VSCode Column Selection Mode](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/e3617f052229d23925fb-d15addf1-d41f-4fa4-9b59-766b47958bad.webp)

### 簡介「資料行選取模式」(Column Selection Mode)

這是一種非常方便的選取模式，可以讓你選取一個「矩形」的文字區塊，而且可以對選取區塊的內容進行編輯。這個功能在其他的編輯器也常看到，但名稱可能不太一樣，有的叫「區塊選取」模式！

我通常是這樣使用的：

**按住 `ALT` 鍵不放，然後用滑鼠左鍵拖曳，就可以選取區塊範圍 (如下圖示)**

![SNAG-0075](https://stwillblogassets.blob.core.windows.net/files/images/external/github.com/f46f5c6bdeffe26daaa5-0380239f-1e2f-4702-b6dd-da40313b58c4.jpg)

由於這是我個人的使用習慣，且並非 VS Code 預設的「快速鍵」與使用方式，所以每次我只要用了別人的電腦，就會忘記這個設定倒底在哪裡。

### 啟用「資料行選取模式」的方法

另一種啟用「資料行選取模式」的方式，則是要透過 `Selection` 主選單，然後點擊 `Column Selection Mode` 項目進行模式切換，接著你就可以直接用滑鼠選取一個區塊，不需要特別按下 `ALT` 鍵。

![SNAG-0076](https://stwillblogassets.blob.core.windows.net/files/images/external/github.com/3d597e9a2da0041addd4-c534c3e3-78df-433d-be1f-e858aff3fa0b.jpg)

但是你在選完之後，還要再點一次 `Selection` 主選單下的 `Column Selection Mode` 項目切換回來，否則你的選取模式會一直保持在「資料行選取模式」，這樣可能會讓你之後的操作感到困惑，所以我覺得這樣很難用。

> 注意: 這個選單的操作完全可以透過「鍵盤」完成，不需要藉助滑鼠的操作。使用方式就跟我們平常用鍵盤在選取文字一樣，用 `SHIFT` + `方向鍵` 就可以選取一個區塊範圍，記得選取完之後要再透過 `Selection` 選單切換回來！

### 搭配快速鍵啟用「資料行選取模式」的方法

在 Visual Studio Code 內建就有支援一個快速鍵，在你按下 `ALT` + `SHIFT` 的情況下，用滑鼠選取一個範圍，也可以自動選取一個區塊，這樣就不需要特別切換模式了。不過，這種操作方式並不是非常直覺，因為正確的用法如下：

1.  先將游標移至你準備要進行「區塊選取」的起始位置（搭配這組快速鍵就一定要做這個動作）
2.  然後再將滑鼠游標移至你要「區塊選取」的結束位置
3.  接著按下 `ALT` + `SHIFT` 不放，然後用滑鼠左鍵點擊一次，這樣就可以選取一個區塊範圍！

這操作太不直覺了，我個人不愛！

### 認識多重選取模式 (Multiple selections) (multi-cursor)

Visual Studio Code 另一個強大的功能，就是支援**多重游標** (multi-cursor) 的編輯模式，又稱**多重選取模式** (Multiple selections)，這個功能可以讓你在同一時間對多個游標進行編輯，這樣可以大幅提升你的編輯效率。

使用方式如下：

1.  先按著 `ALT` 不放，然後用滑鼠左鍵點擊，就可以新增多重游標的位置。
2.  當你點擊多個游標位置後，就可以同時對這些游標進行編輯。

不過，這個「多重選取模式」跟「資料行選取模式」事實上是相關的，因為你在「資料行選取模式」下選取了一個區塊，也等同於新增了多個游標。

### 更好的使用方式

我認為 Visual Studio Code 要這樣設計的原因，就是希望在編輯器 `SHIFT` + `滑鼠左鍵` 的操作模式外，增加一個「區塊選取」的選項，所以設計了 `ALT` + `SHIFT` + `滑鼠左鍵` 的操作模式。但是沒想到這個操作模式完全以「游標目前所在位置」為出發點，如果你不想先定位鍵盤游標，而希望直接由「滑鼠」來決定起迄位置，那麼你最好調整一下這個預設的快速鍵！

我個人是這樣設定的：

1.  先加入一段 `editor.multiCursorModifier` 設定，把多重選取的快速鍵改成 `CTRL` 鍵
    
    ```json
    "editor.multiCursorModifier": "ctrlCmd"
    ```
    
2.  然後就沒有然後了，整篇文章就是這個重點而已，一個步驟而已，也就是我經常被問起但想不起來的設定。
    

經過調整設定之後，你就會得到更棒的 Visual Studio Code 編輯體驗！

1.  更方便的「資料行選取模式」使用方法
    
    首先，按住 `ALT` 鍵不放，然後用滑鼠左鍵直接拖曳一個區塊，就可以選取區塊範圍。
    
    重點是你不用先將鍵盤游標移至起始位置，可以先按 `ALT` 鍵就直接選範圍，這樣真的很方便！
    
    如果你已經定位到起始位置，也可以改按 `CTRL` + `SHIFT` 不放，然後將滑鼠移到結束位置，並用滑鼠左鍵點一下，這樣也可以選取區塊範圍。
    
2.  改用 `CTRL` 鍵來選取多重游標 (因為 `ALT` 鍵已經被我們拿去做區塊選取)
    

### 總結

下次拿到一台新電腦，記得先做出以下設定：

```json
"editor.multiCursorModifier": "ctrlCmd"
```

然後記得 2 件事：

1.  用 `ALT` 鍵搭配滑鼠拖曳進行區塊選取
    
    也可以用 `CTRL` + `SHIFT` 鍵來選取區塊範圍，使用方式有點差異。
    
2.  用 `CTRL` 鍵搭配滑鼠左鍵點擊來新增多重游標
    

本篇文章結束！😃

### 最後補充

我之前有開發過一個 [Easy Insert Numbers](https://marketplace.visualstudio.com/items?itemName=doggy8088.insert-numbers) 擴充套件，就是會利用到 Visual Studio Code 的「多重游標」功能，讓你可以快速在文字編輯器中插入一段連續的數字序號，對於某些編輯的情境下非常實用！

還有《[示範 VS Code 強大的多重游標編輯能力](https://youtu.be/aMdct4G3W1I)》影片記得看，最後也別忘了到[我的 YouTube 頻道](https://www.youtube.com/@Will_Huang)「訂閱」、「按讚」、「分享」並「按下小鈴鐺」喔！😊

### 相關連結

-   [Basic Editing in Visual Studio Code](https://code.visualstudio.com/docs/editor/codebasics)