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 相关文章推荐
js封装的textarea操作方法集合(兼容很好)
Nov 16 Javascript
JQuery页面的表格数据的增加与分页的实现
Dec 10 Javascript
使用AmplifyJS组件配合JavaScript进行编程的指南
Jul 28 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
Oct 29 Javascript
javascript比较语义化版本号的实现代码
Sep 09 Javascript
ES6概念 Symbol.keyFor()方法
Dec 25 Javascript
简单的JS控制button颜色随点击更改的实现方法
Apr 17 Javascript
AngularJS折叠菜单实现方法示例
May 18 Javascript
对angular 实时更新模板视图的方法$apply详解
Oct 09 Javascript
vue使用websocket的方法实例分析
Jun 22 Javascript
js实现跟随鼠标移动的小球
Aug 26 Javascript
JS实现基本的网页计算器功能示例
Jan 16 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
overlord人气高涨,却被菲利普频繁举报,第四季很难在国内上映
2020/05/06 日漫
杏林同学录(一)
2006/10/09 PHP
php Xdebug 调试扩展的安装与使用.
2010/03/13 PHP
php中explode函数用法分析
2014/11/15 PHP
隐性调用php程序的方法
2015/06/13 PHP
thinkPHP框架中layer.js的封装与使用方法示例
2019/01/18 PHP
js实现运行代码需要刷新的解决方法
2007/08/18 Javascript
无缝滚动改进版支持上下左右滚动(封装成函数)
2012/12/04 Javascript
JQuery实现简单时尚快捷的气泡提示插件
2012/12/20 Javascript
基于jQuery.validate及Bootstrap的tooltip开发气泡样式的表单校验组件思路详解
2016/07/18 Javascript
JavaScript性能优化总结之加载与执行
2016/08/11 Javascript
vue 多入口文件搭建 vue多页面搭建的实例讲解
2018/03/12 Javascript
vue项目中使用百度地图的方法
2018/06/08 Javascript
nodejs初始化init的示例代码
2018/10/10 NodeJs
JS双向链表实现与使用方法示例(增加一个previous属性实现)
2019/01/31 Javascript
VUE中使用MUI方法
2019/02/12 Javascript
pageGroup.js实现分页功能
2019/07/27 Javascript
javascript+css实现进度条效果
2020/03/25 Javascript
有关vue 开发钉钉 H5 微应用 dd.ready() 不执行问题及快速解决方案
2020/05/09 Javascript
python3模拟百度登录并实现百度贴吧签到示例分享(百度贴吧自动签到)
2014/02/24 Python
解决Python requests 报错方法集锦
2017/03/19 Python
python实现连续变量最优分箱详解--CART算法
2019/11/22 Python
在python中求分布函数相关的包实例
2020/04/15 Python
Python读取JSON数据操作实例解析
2020/05/18 Python
Python中Selenium模块的使用详解
2020/10/09 Python
Matlab使用Plot函数实现数据动态显示方法总结
2021/02/25 Python
css sprite简单实例
2016/05/23 HTML / CSS
加拿大床上用品、家居装饰、厨房和浴室产品购物网站:Linen Chest
2018/06/05 全球购物
服装设计行业个人的自我评价
2013/12/20 职场文书
聘任书模板
2014/03/29 职场文书
开工典礼策划方案
2014/05/23 职场文书
运动会口号16字
2014/06/07 职场文书
群众路线专项整治方案
2014/10/27 职场文书
党员反邪教心得体会
2016/01/15 职场文书
2019邀请函格式及范文
2019/05/20 职场文书
微信小程序 根据不同用户切换不同TabBar
2022/04/21 Javascript