Appearance
进入包围圈:感受 vim-surround 神器的威力
在第六天的训练中,我们学习了文本对象,学习了如何通过 i
a
进行对一些符号、标签的内部内容进行修改和删除;但有一些时候,我们可能是需要操作包裹着这些内容的符号本身;而这就今天的主角 ——— vim-surround 插件的核心功能。
vim-surround
vim-surround 是关于“包围”的插件:如被括号、括号、引号、XML 标签等等包围。该插件提供映射,可以轻松地成对删除、更改和添加此类包围着内容的符号。它的命令是 s
(请勿与删除并进入 insert mode 的 s
或 vim-sneak 的 s
混淆,这两个是 operator,而 vim-surround 的 s
更像是一个 motion,虽然我不确定这样说准不准确)。
命令示例
以下是 vim-surround 插件 github 仓库 readme 中举得例子;并非我想偷懒,而是官方举得例子实在是已经非常详尽:
我们有如下字符串,光标在它内部时 normal 模式下使用 cs"'
"Hello world!"
则会变成以下这样:
'Hello world!'
这时我们使用 cs'<q>
,就变成了:
<p>Hello world!</p>
再使用 cst"
,就回到最初的模样(疑惑为什么是 t
的人需要去复习一下前面了):
"Hello world!"
删除包裹的符号,我们使用 ds"
:
Hello world!
如果我们把光标移到 hello
单词上,输入 ysiw]
,则变成这样:
[Hello] world!
如果我们要把中括号变成花括号并且单词和符号之间要有空格,我们可以使用 cs]{
(如果使用 }
则添加的花括号是没有空格的,)
]
同理):
{ Hello } world!
这时,我们还可以通过 yssb
或 yss)
来给整行添加包裹:
({ Hello } world!)
输入 ds{ds)
去掉所有包裹:
Hello world!
对于前端开发来说,他是一个很有用的插件;比如我们现在有一个这样的标签:
<p>hello world</p>
这时我们使用 V
进入 linewise visual model(行内可视化模式),再键入 S<div class="important">
,就变成了:
<div class="important">
<p>hello world</p>
</div class="important">
在我们日常开发中,尤其是写 html 时,这非常好用。而且我们还可以使用 .
来重复执行 ds
cs
yss
这类的指令,一如我们之前提到那样。
one more thing
练习群的朋友提到还有一个用法,即配合 t
来出来 xml 或 html 的标签包裹的场景,比如:
hello
在 hello 中输入 ysiwt
+ div
,则变成了:
<div>hello</div>
再输入 ysst
+ div
,就成了:
<div><div>hello</div></div>