原本希望用Emmet,可以自动补全element-ui,但是在MacOS的sublime text上,输入el-input
,然后敲tab,并没有自动变成<el-input></el-input>
。需要按ctrl+e才可以。因为按ctrl+e比较别扭,用起来麻烦多了。
然后突发奇想,干脆做一套code snippet,然后除了补齐标签,再额外添加一些反正都要用的属性,再绑定一些必须的事件,这样开发起来岂不是很方便?
比如el-button
:
elb
-> <el-button type="${1:text}" @click="$2"></el-button>
一些带子元素的,补起来就更爽了,比如el-menu
:
elmen
->
<el-menu mode="${1:horizontal}" :default-active="$2" @select="$3">
<el-submenu v-for="(${4:submenus}, ${5:index}) in ${6:menus}"
:index="${5:index} + 1"
:key="${4:submenus}.${5:key}">
<template slot="title">${4:submenus}.${6:title}</template>
<el-menu-item v-for="(${7:item}, ${8:subIndex}) in ${4:submenus}"
:index="(${5:index} + 1) + '-' + (${8:subIndex} + 1)">
${7:item}.${9:title}
</el-menu-item>
</el-submenu>
</el-menu>
方便快捷了很多。节省了很多敲繁琐代码的时间。
已经提交到Package Control了,搜索Element UI Snippet,已经可以搜索到了。
觉得好用的话,可以点个星,万分感谢。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。