vscode element helper

VSCode-元素助手

VSCode-Element-Helper 是 Element-UI 的 VS Code 扩展。如果您使用ATOM编辑器，请前往ATOM版本

Element-UI 是一个很棒的库。越来越多的项目使用它。于是，为了帮助开发者通过Element-UI更高效地进行编写，VSCode-Element-Helper诞生了。

特征

• 文档

• 自动完成

  支持vue、html和jade/pug语言

• 片段

文档

用法

1 - 将光标移动到 Element-UI 标签或选择它

2 - 按默认热键ctrl + cmd + z （Windows： ctrl + win + z ）或按 ⇧⌘P 调出命令面板，然后输入element-helper.search

3 - 显示文档视图 如果完全匹配，或者您应该选择您要搜索的标签

4 - 输入并触发文档浏览器

版本、引号、缩进大小和语言切换

1 - 输入Preferences -> setting或快捷方式cmd + ,

2 - 修改语言、版本或缩进大小

  "element-helper.language" : "zh-CN" ,
  "element-helper.version" : "1.3" ,
  "element-helper.indent-size" : 2 ,
  "element-helper.quotes" : "double" ,    // html vue qoutes
  "element-helper.pug-quotes" : "single" // jade/pug quotes

自动更新机制

文档离线并自动与Element-UI官方网站同步。

键位图

默认热键是ctrl + cmd + z （Windows： ctrl + win + z ）。如果与其他软件的热键冲突。您可以定制它。查看按键绑定

自动完成

• 区分并自动完成每个 Element-UI 标签的属性和方法

• 当值为 Boolean 或 ICON 等特殊类型时提示值。

片段

支持片段列表：

• msg

   this.$message({
    message: '',
    type: ''
  })
  

• alert

   this.$alert('', '', {
    confirmButtonText: '',
    callback: () => {}
  });
  

• confirm

   this.$confirm('', '', {
    confirmButtonText: '',
    cancelButtonText: '',
    type: ''
  }).then(() => {})
    .catch(() => {});
  

• prompt

   this.$prompt('', '', {
    confirmButtonText: '',
    cancelButtonText: '',
    inputPattern: //,
    inputErrorMessage: ''
  }).then(({ value }) => {})
    .catch(() => {});
  

• msgb

   this.$msgbox({
    title: '',
    message: '',
    showCancelButton: '',
    confirmButtonText: '',
    cancelButtonText: '',
    beforeClose: (action, instance, done) => {}
  }).then(action => {});
  

• notify

   this.$notify({
    title: '',
    message: ''
  });
  

贡献

您的拉取请求将使 VSCode-Element-Helper 变得更好。

执照

麻省理工学院