Element Plus Snippets
主要提供 Element Plus 🌱 组件库语法支持
额外提供 Vue3 ⚡ ES6 ⚡ 常用语法支持
兼容：.vue .ts .scss
驱动更新：下一次更新条件，当下载量达到 520 时
额外提供超级全面的前端笔记：https://note.noxussj.top/?s=ep
开始第一个语法提示
在 .vue 文件中输入 el- 时就会出现一系列 Element Plus 组件的代码提示。
.ts 支持
| 序号 |
触发建议 |
说明 |
类型 |
| 1 |
importApi |
import { ? } from '@/api/?' |
⚡ |
| 2 |
importComponents |
import ? from '@/components/?/index.vue' |
⚡ |
| 3 |
props |
defineProps({}) |
⚡ |
| 4 |
propsType |
PropType<any[]> |
⚡ |
| 5 |
emits |
defineEmits<EmitsType> |
⚡ |
| 6 |
modelValue |
update:modelValue |
⚡ |
| 7 |
forEach |
.forEach((x: any) => {}) |
⚡ |
| 8 |
map |
.map((x: any) => {}) |
⚡ |
| 8 |
find |
.find((x: any) => x.value === ?) |
⚡ |
| 8 |
then |
.then((res: any) => {}) |
⚡ |
| 9 |
rules |
[{ required: true, message: '请输入', trigger: 'blur' }] |
🌱 |
.scss 支持
| 序号 |
触发建议 |
说明 |
类型 |
| 1 |
background |
background: url('@/assets/.png'); |
⚡ |
| 2 |
#409EFF |
Brand Color |
🌱 |
| 3 |
#67C23A |
Success Color |
🌱 |
| 4 |
#E6A23C |
Warning Color |
🌱 |
| 5 |
#F56C6C |
Danger Color |
🌱 |
| 6 |
#909399 |
Info Color |
🌱 |
| 7 |
... |
... |
🌱 |
.html & <template> 支持
| 序号 |
触发建议 |
说明 |
类型 |
| 1 |
v-for |
v-for="(item, index) in " :key="index" |
⚡ |
| 2 |
img |
<img alt="" src="@/assets/.png" /> |
⚡ |
| 3 |
el-button |
<el-button> |
🌱 |
| 4 |
el-row |
<el-row> |
🌱 |
| 5 |
el-col |
<el-col> |
🌱 |
| 6 |
el-link |
<el-link> |
🌱 |
| 7 |
el-scrollbar |
<el-scrollbar> |
🌱 |
| 8 |
el-space |
<el-space> |
🌱 |
| 9 |
el-checkbox |
<el-checkbox> |
🌱 |
| 10 |
el-date-picker |
<el-date-picker type="date"> |
🌱 |
| 11 |
el-date-picker--year |
<el-date-picker type="year"> |
🌱 |
| 12 |
el-date-picker--month |
<el-date-picker type="month"> |
🌱 |
| 13 |
el-date-picker--daterange |
<el-date-picker type="daterange"> |
🌱 |
| 14 |
el-date-picker--datetime |
<el-date-picker type="ddatetimeate"> |
🌱 |
| 15 |
el-form |
<el-form> |
🌱 |
| 16 |
el-input |
<el-input> |
🌱 |
| 17 |
el-input--password |
<el-input type="password"> |
🌱 |
| 18 |
el-input--textarea |
<el-input type="textarea"> |
🌱 |
| 19 |
el-radio |
<el-radio> |
🌱 |
| 20 |
el-select |
<el-select> |
🌱 |
| 21 |
el-select--multiple |
<el-select multiple> |
🌱 |
| 22 |
el-switch |
<el-switch> |
🌱 |
| 23 |
el-time-picker |
<el-time-picker> |
🌱 |
| 24 |
el-time-select |
<el-time-select> |
🌱 |
| 25 |
el-calendar |
<el-calendar> |
🌱 |
| 26 |
el-carousel |
<el-carousel> |
🌱 |
| 27 |
el-image |
<el-image> |
🌱 |
| 28 |
el-pagination |
<el-pagination> |
🌱 |
| 29 |
el-table |
<el-table> |
🌱 |
| 30 |
el-tag |
<el-tag> |
🌱 |
| 31 |
el-breadcrumb |
<el-breadcrumb> |
🌱 |
| 32 |
el-tabs |
<el-tabs> |
🌱 |
| 33 |
el-dialog |
<el-dialog> |
🌱 |
| 34 |
el-drawer |
<el-drawer> |
🌱 |
.vue 支持
| 序号 |
触发建议 |
说明 |
类型 |
| 1 |
template |
<template> |
⚡ |
| 2 |
script-ts-setup |
<script lang="ts" setup> |
⚡ |
| 3 |
scss |
<style lang="scss" scoped> |
⚡ |
| 4 |
scss-import |
@import './index.scss'; |
⚡ |
| |
