Vim快速合并行及vim 将文件所有行合并到一行


Posted in Javascript onNovember 27, 2017

VIM (Unix及类Unix系统文本编辑器)

Vim是一个类似于Vi的著名的功能强大、高度可定制的文本编辑器,在Vi的基础上改进和增加了很多特性。VIM是自由软件。 Vim普遍被推崇为类Vi编辑器中最好的一个,事实上真正的劲敌来自Emacs的不同变体。1999 年Emacs被选为Linuxworld文本编辑分类的优胜者,Vim屈居第二。但在2000年2月Vim赢得了Slashdot Beanie的最佳开放源代码文本编辑器大奖,又将Emacs推至二线, 总的来看, Vim和Emacs在文本编辑方面都是非常优秀的

Vim快速合并行及vim 将文件所有行合并到一行

刚接触 Vim 会觉得它的学习曲线非常陡峭,要记住很多命令。所以这个系列的分享,不会教你怎么配置它,而是教你怎么快速的使用它。

在开发时为了代码美观,经常会把属性用换行的方式显示。

<el-dialog 
 title="批量编辑所属组织" 
 :visible.sync="isShow" 
 :before-close="beforeClose"
 >
 ...
 </el-dialog>

这种场景适用于标签属性少,代码量也少的情况。

如果标签突然增多,阅读起来就会很不方便。比如下面这样:

<template>
 <el-table
 :data="tableData"
 border
 style="width: 100%">
 <el-table-column
  fixed
  prop="date"
  label="日期"
  width="150">
 </el-table-column>
 <el-table-column
  prop="name"
  label="姓名"
  width="120">
 </el-table-column>
 <el-table-column
  prop="province"
  label="省份"
  width="120">
 </el-table-column>
 <el-table-column
  prop="city"
  label="市区"
  width="120">
 </el-table-column>
 <el-table-column
  prop="address"
  label="地址"
  width="300">
 </el-table-column>
 <el-table-column
  prop="zip"
  label="邮编"
  width="120">
 </el-table-column>
 <el-table-column
  fixed="right"
  label="操作"
  width="100">
  <template scope="scope">
  <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
  <el-button type="text" size="small">编辑</el-button>
  </template>
 </el-table-column>
 </el-table>
</template>

所以我们就需要把标签和属性变为一行。

<template>
 <el-table :data="tableData" border style="width: 100%">
 <el-table-column fixed prop="date" label="日期" width="150"> </el-table-column>
 <el-table-column prop="name" label="姓名" width="120"> </el-table-column>
 <el-table-column prop="province" label="省份" width="120"> </el-table-column> 
 <el-table-column prop="city" label="市区" width="120"> </el-table-column>
 <el-table-column prop="address" label="地址" width="300"> </el-table-column>
 <el-table-column prop="zip" label="邮编" width="120"> </el-table-column>
 <el-table-column fixed="right" label="操作" width="100">
  <template scope="scope">
  <el-button @click="handleClick(scope.row)" type="text" size="small">查看</el-button>
  <el-button type="text" size="small">编辑</el-button>
  </template>
 </el-table-column>
 </el-table>
</template>

多数 IDE 在代码格式化时,都不会处理标签的属性。

我们只能通过光标换行,然后在按删除的方式进行解决。

那么接下来介绍的这个技巧,叫 “合并行”,能让我们快速的解决这个问题。

Vim快速合并行及vim 将文件所有行合并到一行

操作步骤:

1. 按 ESC 进入 Normal 模式,移动游标定位到第 2 行的位置。

2. 按 shift+j 就可以实现合并行的操作。

PS:vim 将文件所有行合并到一行

在 Normal Mode下执行:

ggvGJ

gg 用于跳到行首

v 转换成 visual 模式

G 跳到最后一行

J 合并行

总结

以上所述是小编给大家介绍的Vim常用操作快速合并行功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jQuery图片预加载 等比缩放实现代码
Oct 04 Javascript
JS保存、读取、换行、转Json报错处理方法
Jun 14 Javascript
jQuery实现鼠标悬停背景翻转的黑色导航菜单代码
Sep 14 Javascript
js实现增加数字显示的环形进度条效果
Feb 05 Javascript
JavaScript之map reduce_动力节点Java学院整理
Jun 29 Javascript
Javascript之图片的延迟加载的实例详解
Jul 24 Javascript
详解Web使用webpack构建前端项目
Sep 23 Javascript
浅谈在vue中使用mint-ui swipe遇到的问题
Sep 27 Javascript
vue导航栏部分的动态渲染实例
Nov 01 Javascript
JS检索下拉列表框中被选项目的索引号(selectedIndex)
Dec 17 Javascript
js获取本日、本周、本月的时间代码
Feb 01 Javascript
JavaScript array常用方法代码实例详解
Sep 02 Javascript
详解利用Angular实现多团队模块化SPA开发框架
Nov 27 #Javascript
JavaScript实现修改伪类样式
Nov 27 #Javascript
Vue.js搭建移动端购物车界面
Jun 28 #Javascript
Vue实现购物车场景下的应用
Nov 27 #Javascript
javascript字体颜色控件的开发 JS实现字体控制
Nov 27 #Javascript
vue购物车插件编写代码
Nov 27 #Javascript
Vue.js devtool插件安装后无法使用的解决办法
Nov 27 #Javascript
You might like
php生成局部唯一识别码LUID的代码
2012/10/06 PHP
解析php中如何直接执行SHELL
2013/06/28 PHP
php中simplexml_load_file函数用法实例
2014/11/12 PHP
PHP实现仿Google分页效果的分页函数
2015/07/29 PHP
Symfony控制层深入详解
2016/03/17 PHP
针对thinkPHP5框架存储过程bug重写的存储过程扩展类完整实例
2018/06/16 PHP
php依赖注入知识点详解
2019/09/23 PHP
javascript基础第一章 JavaScript与用户端
2010/07/22 Javascript
js动态添加事件并可传参数示例代码
2013/10/21 Javascript
使用js简单实现了tree树菜单
2013/11/20 Javascript
jquery和javascript中如何将一元素的内容赋给另一元素
2014/01/09 Javascript
当某个文本框成为焦点时即清除文本框内容
2014/04/28 Javascript
JavaScript fontsize方法入门实例(按照指定的尺寸来显示字符串)
2014/10/17 Javascript
jquery zTree异步加载、模糊搜索简单实例分享
2016/03/24 Javascript
jquery获取复选框的值的简单实例
2016/05/26 Javascript
基于JS实现无缝滚动思路及代码分享
2016/06/07 Javascript
利用jQuery来动态为属性添加或者删除属性的简单方法
2016/12/02 Javascript
jQuery插件HighCharts绘制2D圆环图效果示例【附demo源码下载】
2017/03/09 Javascript
防止页面url缓存中ajax中post请求的处理方法
2017/10/10 Javascript
解决iview打包时UglifyJs报错的问题
2018/03/07 Javascript
Python and、or以及and-or语法总结
2015/04/14 Python
使用Python读写文本文件及编写简单的文本编辑器
2016/03/11 Python
利用python实现简单的循环购物车功能示例代码
2017/07/05 Python
Python实现将MySQL数据库表中的数据导出生成csv格式文件的方法
2018/01/11 Python
Python实现连接两个无规则列表后删除重复元素并升序排序的方法
2018/02/05 Python
PHP统计代码行数的小代码
2019/09/19 Python
Python使用QQ邮箱发送邮件实例与QQ邮箱设置详解
2020/02/18 Python
python新手学习可变和不可变对象
2020/06/11 Python
python中return不返回值的问题解析
2020/07/22 Python
Pytorch实现WGAN用于动漫头像生成
2021/03/04 Python
美国专营婴幼儿用品的购物网站:buybuy BABY
2017/01/01 全球购物
公司离职证明标准格式
2014/11/18 职场文书
会计岗位职责范本
2015/04/02 职场文书
关于公司年会的开幕词
2016/03/04 职场文书
windows安装python超详细图文教程
2021/05/21 Python
Java 实战项目之家居购物商城系统详解流程
2021/11/11 Java/Android