如何在Vim中选中含嵌套标签的自闭合组件整体内容？

针对React自闭合组件的选中需求，这里有几个实用的原生Vim命令和小技巧：

• 最直接的原生命令：v%
  把光标定位在自闭合标签开头的<或者结尾的/>上，按下v%就能一次性选中从开头<到结尾/>的全部内容。Vim的%命令本身就支持匹配成对的标签结构，包括自闭合标签，完美适配你的场景。

• 如果习惯用vi<系列命令，补个小操作
  要是你已经按了vi<只选中了部分内容，不用取消选区，直接按o切换到选区的另一端，再按%就能跳到最外层的闭合处，自动扩展选区到完整标签。

• 自定义映射简化操作（可选）
  要是觉得每次按v%不够顺手，可以在你的Vim配置文件（.vimrc或init.vim）里加个自定义映射，比如：

  nnoremap <leader>vc v%
  

  之后只要按<leader>vc（<leader默认是反斜杠）就能快速选中整个自闭合标签。

举个实际例子，针对你给出的组件代码：

<MyComponent
   foo={bar}
   leftFooSection={<FooBar/>}
   ...
   label={'yes'} />

把光标放在开头的<上，按下v%，就能精准选中从<MyComponent到最后的/>的全部内容，包括内部的嵌套组件属性。

至于你提到的vi<或vi>失效的原因：这两个命令是选中标签内部的内容，遇到嵌套标签的>就会停止，所以只会选中到<FooBar/>的>，而不是最外层的/>。

内容的提问来源于stack exchange，提问作者iamaword