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 變得更好。

執照

麻省理工學院