Skip to content
| Marketplace
Sign in
Visual Studio Code>Snippets>simple-code-snippettNew to Visual Studio Code? Get it now.
simple-code-snippett

simple-code-snippett

yangjianvs

|
74 installs
| (0) | Free
it's a code snippet plugin
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

simple-code-snippet

简介

插件收录了部分常用代码 snippets,包括 element-ui 组件、element-plus 组件、 javascript、css、Vue Option API、Composition API 等,它能够帮你节省输入大段常用代码工作量,同时减少查阅文档时间

安装

VSCode Extensions 中安装插件 yangjianvs.simple-code-snippet

使用 snippets

snippets 是以 u 开头的一串字符,如当需要编写 element-plus 中的 button 组件时,可输入如下 snippet,将替换为 el-button 组件,并例举出组件常用属性

  • uel-button
// snippet
<el-button type="warning" plain round circle link disabled :icon="Edit"></el-button>
  • uel-menu
<el-menu mode="horizontal"  @select="">
  <el-menu-item index="1">
    <el-icon><Edit /></el-icon>
    <template #title>菜单1</template>
  </el-menu-item>

  <el-sub-menu index="2">
    <template #title>
      <el-icon><Edit /></el-icon>
      <span>1-1</span>
    </template>
    <el-menu-item index="">
      1-2
    </el-menu-item>
  </el-sub-menu>
</el-menu>

Vue Composition API 使用

  • uwatch
const count = ref(0)
const stop = watch(
  count, // 函数返回值 | 一个ref | 数组
  (val, oldVal) => {}
  { immediate: true,  deep: true}
)
stop() // 停止监听

  • uslot
<!-- 具名作用域插槽, 默认插槽 v-slot="slotProps" -->
<Comp #header="slotProps">
{{ slotProps.text }} {{ slotProps.count }}
</Comp>

// Comp
<div>
  <slot name="header" :text="message" :count="1"></slot>
</div>

你也可以在本地 vscode 插件安装出,找到 code-snippet-master 文件夹,自定义需要的 snippet,而无需发布。这是 snippet 插件常用的方式

Webview

通过VSCode Extension 内置 Webview 实现在编辑器内部打开网页,选中查询字符,右键Open doc in editor选择查询站点。由于部分站点对iframe的限制,可通过浏览器访问。 如下:

  • √ vue2 API -> https://v2.cn.vuejs.org/v2/api
  • √ element-ui 组件 -> https://element.eleme.cn/#/zh-CN/component
  • NPM -> https://www.npmjs.com
  • MDN web -> https://developer.mozilla.org/zh-CN
  • 百度一下 -> https://baidu.com

And More

在使用中有任何问题,欢迎留下 Issues ,将不断完善。

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
© 2025 Microsoft