刚接触 Vim 会以为它的学习曲线很是陡峭,要记住不少命令。因此这个系列的分享,不会
教你怎么配置它,而是教你怎么快速的使用它。学习
在开发时为了代码美观,常常会把属性用换行的方式显示。spa
<el-dialog title="批量编辑所属组织" :visible.sync="isShow" :before-close="beforeClose" > ... </el-dialog>
这种场景适用于标签属性少,代码量也少的状况。
若是标签忽然增多,阅读起来就会很不方便。好比下面这样:code
<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>
因此咱们就须要把标签和属性变为一行。orm
<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 在代码格式化时,都不会处理标签的属性。
咱们只能经过光标换行,而后在按删除的方式进行解决。
那么接下来介绍的这个技巧,叫 “合并行”,能让咱们快速的解决这个问题。blog
操做步骤:
1. 按 ESC 进入 Normal 模式,移动游标定位到第 2 行的位置。
2. 按 shift+j 就能够实现合并行的操做。ip