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 在代码格式化时,都不会处理标签的属性。
我们只能通过光标换行,然后在按删除的方式进行解决。
那么接下来介绍的这个技巧,叫 “合并行”,能让我们快速的解决这个问题。

操作步骤:
1. 按 ESC 进入 Normal 模式,移动游标定位到第 2 行的位置。
2. 按 shift+j 就可以实现合并行的操作。
Vim常用操作-合并行。的更多相关文章
- VIM常用操作手册
VIM常用操作手册 1.多行操作,多行注释,多行取消注释 https://jingyan.baidu.com/article/9c69d48f43ed6d13c8024e7b.html 2.常用操作 ...
- VIM常用操作总结
VIM常用的模式网上说法不太一样,但是大同小异,这里大致分一下,便于后面总结 1.一般模式 默认打开文件后的模式,这个时候只能移动光标,不能编辑 2.输入模式 一般模式按下i,就可以进入输入模式,输入 ...
- vim常用操作技巧与配置
vi是linux与unix下的常用文本编辑器,其运行稳定,使用方便,本文将分两部分对其常用操作技巧和配置进行阐述,其中参考了网上的一些文章,对作者表示感谢 PART1 操作技巧 说明: 以下的例子中 ...
- [编辑器]vim常用操作
我是ide的用户,对于vim一只停留在:打开.看.写.关闭基本操作,因为现在更多的接触linux服务器,所以为了提高 效率,用好vim是必备技能!下面罗列一些vim的常用操作,用做备忘(不断更新): ...
- 【linux】vim常用操作及vim插件的安装使用
vim是linux下一个非常好用的文本编辑器,在linux下开发的人员要熟练掌握vim常用命令. 1. 打开在第n行 vim +143 filename.txt 2. 只读模式打开 vim -R / ...
- vim常用操作和使用技巧
vi是linux与unix下的常用文本编辑器,其运行稳定,使用方便,本文将分两部分对其常用操作技巧和配置进行阐述,其中参考了网上的一些文章,对作者表示感谢 PART1 操作技巧 说明: 以下的例子中 ...
- Linux(Ubuntu)常用命令(五)—— vi/vim常用操作
vi/vim常用命令 vim其实就是vi的升级版,vi里的所有命令vim里都可以用,一般使用来说几乎没什么差别. 注:本篇文章区分大小写! vi / vim三级模式的关系: 命令行模式 任何时候,不管 ...
- Linux下Vim常用操作
linux下Vim的常用操作 linux 首先\(ctrl+Alt+t\)打开小框框 \(./\):相当于手机上的\(home\)键 \(ls\):当前文件夹的东东 \(mkdir\) ...
- 想法子记忆Vi/Vim常用操作及指令
本笔记有特殊目录,点击开启: 专有目录 在Linux系统中编辑文本总是离不开一位老帮手--Vi.而因为其诞生的年代有些久远,有些操作在现在看来可能有点"反直觉". 于是我决定写这样 ...
随机推荐
- Appium python自动化测试系列之移动自动化测试前提(一)
1.1 移动自动化测试现状 因为软件行业越来越发达,用户的接受度也在不断提高,所以对软件质量的要求也随之提高,当然这个也要分行业,但这个还是包含了大部分.因为成本.质量的变化现在对自动化测试的重视度越 ...
- vim中SnipMate 和 YouCompleteMe 插件触发键 tab 冲突
花了好几天废了九牛二虎之力终于在win下把ycm插件装上了 然而在配置插件的时候发现snipmate插件与youcompleteme插件会发生tab键冲突 而ycm比较调,直接使snipmate插件完 ...
- 同步IO和异步IO
链接: 同步IO和异步IO socket阻塞与非阻塞,同步与异步.I/O模型 Linux的IO系统常用系统调用及分析 linux异步IO的两种方式
- vux 组件打造手机端项目
其实,我用vux组件的过程是这样的,哇!太方便了!!功能好全!!太简单了!!然后,就各种"跳坑".以下排坑环节. 1.安装vux:cnpm i -S vux; 比较顺利吧. 2 ...
- 【ASP.NET MVC 学习笔记】- 11 Controller和Action(2)
本文参考:http://www.cnblogs.com/willick/p/3331513.html 1.MVC一个请求的发出至action返回结果的流程图如下: 重点是Controller Fact ...
- celery rabbit mq 详解
Celery介绍和基本使用 Celery 是一个 基于python开发的分布式异步消息任务队列,通过它可以轻松的实现任务的异步处理, 如果你的业务场景中需要用到异步任务,就可以考虑使用celery, ...
- js获取当前页面的URL并且截取?之后的数据,返回json
js获取当前页面的URL并且截取'?'之后的数据,返回json格式的数据 最近想要把学到的东西整理一下,以后方便查找,也是一种自我累积,如果有错误或者更好的,欢迎提出! 这篇文档主要是写关于获取页面的 ...
- 使用sklearn进行数据挖掘-房价预测(4)—数据预处理
在使用机器算法之前,我们先把数据做下预处理,先把特征和标签拆分出来 housing = strat_train_set.drop("median_house_value",axis ...
- spark的sparkUI如何解读?
spark的sparkUI如何解读? 以spark2.1.4来做例子 Job - schedule mode 进入之后默认是进入spark job 页面 这个说明有很详细的解释,spark有两种操作算 ...
- 如何用Android Studio同时使用SVN和Git管理项目
这篇来讲讲如何在 Android Studio 上同时用 SVN 和 Git 来管理项目.我知道,你肯定会说我吃饱了撑着,没事找事做,为啥要同时用 SVN 和 Git 来管理项目.问题是,我也不想啊, ...