𝑻𝒆𝒏𝑪𝒍𝒂𝒘正在头脑风暴···
𝑻𝒆𝒏𝑲𝒊𝑺𝒆𝒀𝒂の𝑨𝒈𝒆𝒏𝒕助手
𝑻𝒆𝒏-𝒇𝒍𝒂𝒔𝒉

VS Code 多光标编辑技巧

VS Code 的多光标编辑功能可以大幅提高编码效率。

基础操作

扩展光标

  • 方法1: Ctrl + D - 选中当前单词,按多次扩展选中
  • 方法2: Ctrl + Shift + L - 选中所有相同单词
// 选中所有 "const" 并修改
const x = 1;
const y = 2;
const z = 3;

// 按 Ctrl + Shift + L 选中所有 "const"
// 修改为: let
let x = 1;
let y = 2;
let z = 3;

快速选中相同单词

// 选中所有 "console.log"
console.log("Hello");
console.log("World");
console.log("Test");

// Ctrl + D (选中第一个 console.log)
// 再按 Ctrl + D (选中所有)

高级多光标操作

删除行

  • Shift + Alt + Up/Down - 复制当前行到上方/下方
  • Shift + Alt + Down - 删除当前行并插入到下方

选中行范围

  • Ctrl + L - 选中当前行

选中单词

  • Ctrl + Shift + Right/Left - 选中单词

插入光标

  • Alt + Click - 在任意位置点击插入光标
  • Ctrl + Alt + Up/Down - 垂直方向添加光标
  • Ctrl + J - 合并光标

匹配光标

  • Ctrl + Shift + K - 选中匹配的括号

实战案例

案例1: 批量修改代码

// 批量添加 console.log
const x = 1;
const y = 2;
const z = 3;

// 光标放在 const 上
// Ctrl + D (选中所有 const)
// 按 Enter 逐个编辑
// 添加 console.log

console.log(x);
console.log(y);
console.log(z);

案例2: 格式化代码

function add(a, b) {
return a + b;
}

// 选中函数定义
// Ctrl + Shift + P → "Format Document"
// 自动格式化

案例3: 重构变量名

const userName = "张三";
const userEmail = "zhangsan@example.com";

// 选中 userName
// Ctrl + D (选中所有 userName)
// 修改为 user
const user = "张三";
const user = "zhangsan@example.com";

案例4: 批量注释

const a = 1;
const b = 2;
const c = 3;

// 选中多行
// Ctrl + / (添加/移除注释)
// 或者 Ctrl + K Ctrl + /

配置快捷键

自定义多光标快捷键

{
"editor.multiCursorModifier": "ctrlCmd", // 默认 Ctrl
"editor.multiCursorPaste": "spread" // 粘贴时扩展光标
}

推荐配置

{
// 启用多光标粘贴扩展
"editor.multiCursorPaste": "spread",

// 在选中区域中搜索
"editor.search.multiCursorSelection": "active",

// 快速替换选中内容
"editor.quickSuggestions": {
"other": true,
"comments": false,
"strings": true
}
}

多光标插件

推荐插件

  • Cursorless - 增强的光标操作
  • Multi-Cursor Search - 多光标搜索
  • Text Actions - 文本操作增强

Cursorless 用法

  • Ctrl + Shift + P → “Cursorless” 命令
  • 使用手势控制光标操作

常见快捷键总结

快捷键功能
Ctrl + D选中下一个相同单词
Ctrl + Shift + L选中所有相同单词
Alt + Click插入光标
Ctrl + Alt + Up/Down垂直添加光标
Ctrl + J合并光标
Shift + Alt + Up/Down复制/删除行
Ctrl + L选中行
Ctrl + K Ctrl + D快速选中下一个

进阶技巧

智能选择

// 使用正则表达式选择
// Ctrl + F → 正则表达式搜索
// 转换为光标

选中块

// 选中代码块
// Ctrl + Shift + E (在某些配置中)

批量替换

// 按 Ctrl + H
// 选中所有匹配
// 逐个修改

最佳实践

  1. 适度使用:避免过度使用影响可读性
  2. 注意范围:确保在合适范围内使用
  3. 配合撤销:Ctrl + Z 快速撤销误操作

多光标编辑是提升开发效率的利器,多加练习!