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的document.ready更快的方法
Apr 28 Javascript
JS控件ASP.NET的treeview控件全选或者取消(示例代码)
Dec 16 Javascript
jquery实现上下左右滑动的方法
Feb 09 Javascript
原生JS实现响应式瀑布流布局
Apr 02 Javascript
js实现YouKu的漂亮搜索框效果
Aug 19 Javascript
延时加载JavaScript代码提高速度
Dec 27 Javascript
利用ES6语法重构React组件详解
Mar 02 Javascript
使用jQuery ajaxupload插件实现无刷新上传文件
Apr 23 jQuery
Vue 解决多级动态面包屑导航的问题
Nov 04 Javascript
vue组件内部引入外部js文件的方法
Jan 18 Javascript
vue自定义组件实现双向绑定
Jan 13 Vue.js
ECharts transform数据转换和dataZoom在项目中使用
Dec 24 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与python实现的线程池多线程爬虫功能示例
2016/10/12 PHP
php实现评论回复删除功能
2017/05/23 PHP
用JavaScript实现仿Windows关机效果
2007/03/10 Javascript
网页加载时页面显示进度条加载完成之后显示网页内容
2012/12/23 Javascript
nodejs中实现阻塞实例
2015/03/24 NodeJs
ajax+jQuery实现级联显示地址的方法
2015/05/06 Javascript
javascript仿百度输入框提示自动下拉补全
2016/01/07 Javascript
js判断图片加载完成后获取图片实际宽高的方法
2016/02/25 Javascript
Bootstrap学习笔记之进度条、媒体对象实例详解
2017/03/09 Javascript
微信小程序 动态绑定数据及动态事件处理
2017/03/14 Javascript
B/S(Web)实时通讯解决方案分享
2017/04/06 Javascript
基于JavaScript实现无限加载瀑布流
2017/07/21 Javascript
js字符限制(字符截取) 一个中文汉字算两个字符
2017/09/12 Javascript
JS实现鼠标按下拖拽效果
2020/07/23 Javascript
Vant 中的Toast设置全局的延迟时间操作
2020/11/04 Javascript
使用Vant完成通知栏Notify的提示操作
2020/11/11 Javascript
介绍Python的Urllib库的一些高级用法
2015/04/30 Python
在Python的Flask框架中构建Web表单的教程
2016/06/04 Python
Python学习笔记之解析json的方法分析
2017/04/21 Python
python中安装Scrapy模块依赖包汇总
2017/07/02 Python
python+pyqt5编写md5生成器
2019/03/18 Python
PyQt5 加载图片和文本文件的实例
2019/06/14 Python
python PyAutoGUI 模拟鼠标键盘操作和截屏功能
2019/08/04 Python
Python tkinter常用操作代码实例
2020/01/03 Python
python numpy库linspace相同间隔采样的实现
2020/02/25 Python
10个python爬虫入门实例(小结)
2020/11/01 Python
美国最古老的精致书写工具制造商:A.T. Cross(高仕)
2018/01/30 全球购物
瑞典快乐袜子:Happy Socks
2018/02/16 全球购物
室内设计专业个人的自我评价
2013/10/19 职场文书
轻金属冶金专业毕业生自荐信
2013/11/02 职场文书
工商治理实习生的自我评价
2014/01/15 职场文书
十八届三中全会感言
2014/03/10 职场文书
旅游专业毕业生自荐书
2014/06/30 职场文书
公司规章制度范本
2015/08/03 职场文书
golang 实现两个结构体复制字段
2021/04/28 Golang
MySQL主从切换的超详细步骤
2022/06/28 MySQL