# ng-snippets

**Repository Path**: SunshineC/ng-snippets

## Basic Information

- **Project Name**: ng-snippets
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-01-28
- **Last Updated**: 2026-01-28

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# public snippets

public snippets 代码片段包含如下片段，直接安装插件即可使用。

```text
- vue
- vue.html
- vuex
- vueRouter
- JavaScript
```

## Prefix

### JavaScript

| Prefix       | Snippets                               |
| ------------ | -------------------------------------- |
| `cls`        | console.log( string )                  |
| `cv`         | const v = ""                           |
| `lv`         | let v = ""                             |
| `funn`       | function name(){}                      |
| `of`         | name(){}                               |
| `af`         | arrow function                         |
| `afn`        | named arrow function                   |
| `forL`       | for loop                               |
| `fofL`       | fof loop                               |
| `finL`       | fin loop                               |
| `scL`        | switch case loop                       |
| `setI`       | setInterval                            |
| `setT`       | setTimeout                             |
| `promise`    | new Promise                            |
| `promiseTCF` | new Promise().then().catch().finally() |

### import

| Prefix | Snippets                |
| ------ | ----------------------- |
| `imp`  | import $2 from '$1'     |
| `imd`  | import { $2 } from '$1' |

### Vue.html

| Prefix  | Snippets                                |
| ------- | --------------------------------------- |
| `click` | @click="$1"                             |
| `if`    | v-if="$1"                               |
| `ef`    | v-else-if="$1"                          |
| `else`  | v-else="$1"                             |
| `fori`  | v-for="item in $1" :key="item"          |
| `forii` | v-for="(item, index) in $1" :key="item" |
| `model` | v-model="$1"                            |
| `cData` | :class="{ $1 : $2 }"                    |
| `cCalc` | :class="[ $1 ? $2 : $3 ]"               |
| `style` | :style="{}"                             |
| `sData` | :style="{ $1 : $2 }"                    |
| `sCalc` | :style="{ $1 : $2 ? $3 : $4}"           |

### Vue base

| Prefix         | Snippets                               |
| -------------- | -------------------------------------- |
| `vcss`         | vue2 css 基础代码                      |
| `vless`        | vue2 less 基础代码                     |
| `vscss`        | vue2 scss 基础代码                     |
| `vvcss`        | vue3 css 基础代码                      |
| `vvless`       | vue3 less 基础代码                     |
| `vvscss`       | vue3 scss 基础代码                     |
| `vvcss-DC`     | vue3 css 基础代码 ( defineComponent )  |
| `vvless-DC`    | vue3 less 基础代码 ( defineComponent ) |
| `vvscss-DC`    | vue3 scss 基础代码 ( defineComponent ) |
| `vvcss-setup`  | vue3 css 基础代码 ( setup 语法糖 )     |
| `vvless-setup` | vue3 less 基础代码 ( setup 语法糖 )    |
| `vvscss-setup` | vue3 scss 基础代码 ( setup 语法糖 )    |
| `uscss`        | uniapp vue2 基础代码                   |
| `uuscss`       | uniapp vue3 基础代码                   |

### Vue2

| Prefix        | Snippets                             |
| ------------- | ------------------------------------ |
| `vdata`       | vue2 data                            |
| `vComponents` | vue2 components                      |
| `vProps`      | vue2 props                           |
| `vPropsD`     | vue2 props ( default )               |
| `vPropsDR`    | vue2 props ( default required )      |
| `vEmit`       | vue2 emit                            |
| `vMixins`     | vue2 混入 mixins                     |
| `vMethods`    | vue2 方法 methods                    |
| `vComputed`   | vue2 计算属性 computed               |
| `vComputedS`  | vue2 计算属性 computed ( setter )    |
| `vWatch`      | vue2 侦听器 watch                    |
| `vWatchD`     | vue2 侦听器 watch ( deep )           |
| `vWatchI`     | vue2 侦听器 watch ( immediate )      |
| `vWatchDI`    | vue2 侦听器 watch ( deep immediate ) |
| `vFilters`    | vue2 过滤器 filters                  |
| `vNextNick`   | vue2 NextNick                        |
| `vBCreate`    | vue2 生命周期 beforeCreate           |
| `vCreated`    | vue2 生命周期 created                |
| `vBMount`     | vue2 生命周期 beforeMount            |
| `vMounted`    | vue2 生命周期 mounted                |
| `vBUpdate`    | vue2 生命周期 beforeUpdate           |
| `vUpdated`    | vue2 生命周期 updated                |
| `vBUnmount`   | vue2 生命周期 beforeUnmount          |
| `vUnmounted`  | vue2 生命周期 unmounted              |

### Vue3

| Prefix          | Snippets                                  |
| --------------- | ----------------------------------------- |
| `vvFun`         | vue3 定义一个函数                         |
| `vvSetup`       | vue3 setup(){}                            |
| `vvSetup-param` | vue3 setup(props, {attrs, slots, emit}){} |
| `vvRoute`       | vue3 useRoute                             |
| `vvRouter`      | vue3 useRouter                            |
| `vvStore`       | vue3 useStore                             |
| `vvRef`         | vue3 ref                                  |
| `vvToRef`       | vue3 toRef                                |
| `vvIsRef`       | vue3 isRef                                |
| `vvReactive`    | vue3 reactive                             |
| `vvToRefs`      | vue3 toRefs                               |
| `vvUnref`       | vue3 unref                                |
| `vvIsProxy`     | vue3 isProxy                              |
| `vvIsReactive`  | vue3 isReactive                           |
| `vvReadonly`    | vue3 readonly                             |
| `vvIsReadonly`  | vue3 isReadonly                           |
| `vvProps`       | vue3 defineProps                          |
| `vvEmits`       | vue3 defineEmits                          |
| `vvSlots`       | vue3 useSlots                             |
| `vvAttrs`       | vue3 useAttrs                             |
| `vvExpose`      | vue3 暴露数据 defineExpose                |
| `vvComputed`    | vue3 计算属性 computed                    |
| `vvWatch`       | vue3 侦听器 watch                         |
| `vvWatchD`      | vue3 侦听器 watch ( deep )                |
| `vvWatchI`      | vue3 侦听器 watch ( immediate )           |
| `vvWatchDI`     | vue3 侦听器 watch ( deep immediate )      |
| `vvWatchArr`    | vue3 侦听器 Watch 多个 ref                |
| `vvWatchObj`    | vue3 侦听器 Watch reactive 中单个 key     |
| `vvWE`          | vue3 侦听器 watchEffect                   |
| `vvBMounted`    | vue3 生命周期 onBeforeMount               |
| `vvMounted`     | vue3 生命周期 onMounted                   |
| `vvBUpdate`     | vue3 生命周期 onBeforeUpdate              |
| `vvUpdated`     | vue3 生命周期 onUpdated                   |
| `vvBUnmount`    | vue3 生命周期 onBeforeUnmount             |
| `vvUnmounted`   | vue3 生命周期 onUnmounted                 |
| `vvGP`          | vue3 全局属性 globalProperties            |
| `vvNextTick`    | vue3 NextTick                             |

### Vue2&Vue3

| Prefix   | Snippets                  |
| -------- | ------------------------- |
| `propD`  | vue default prop          |
| `propR`  | vue required prop         |
| `propRD` | vue required default prop |

### vueRouter

| Prefix       | Snippets                                       |
| ------------ | ---------------------------------------------- |
| `vrPush`     | v2 this.$router.push()                         |
| `vrReplace`  | v2 this.$router.replace()                      |
| `vrGo`       | v2 this.$router.go()                           |
| `vvrPush`    | v3 router.push()                               |
| `vvrReplace` | v3 router.replace()                            |
| `vvrGo`      | v3 router.go()                                 |
| `vrBEach`    | beforeEach 前置守卫                            |
| `vrBResolve` | beforeResolve 解析守卫                         |
| `vrAEach`    | afterEach 后置守卫                             |
| `vrBEnter`   | beforeEnter 路由独享的守卫                     |
| `vrBREnter`  | beforeRouteEnter 组件内的守卫 ( Enter 进入 )   |
| `vrBRUpdate` | beforeRouteUpdate 组件内的守卫 ( Update 更新 ) |
| `vrBRLeave`  | beforeRouteLeave 组件内的守卫 ( Leave 离开 )   |

### vuex

| Prefix       | Snippets                |
| ------------ | ----------------------- |
| `vCommit`    | vue2 提交一个 commit    |
| `vDispatch`  | vue2 提交一个 dispatch  |
| `vvCommit`   | vue3 store.commit("")   |
| `vvDispatch` | vue3 store.dispatch("") |

### pinia

| Prefix    | Snippets          |
| --------- | ----------------- |
| `pinia`   | Pinia 的基本结构  |
| `pToRefs` | pinia storeToRefs |
| `pPatch`  | pinia $patch      |

### UniApp Base

| Prefix   | Snippets             |
| -------- | -------------------- | ------------ |
| `uscss`  | uniapp vue2 基础代码 | vsce package |
| `uuscss` | uniapp vue3 基础代码 |

### 常用函数

| Prefix         | Snippets      |
| -------------- | ------------- |
| `__deepClone`  | 深度克隆      |
| `__debounce`   | 函数防抖      |
| `__throttle`   | 函数节流      |
| `__dataType`   | 检查数据类型  |
| `__isPureNum`  | 验证 - 纯数字 |
| `__isPhoneNum` | 验证 - 手机号 |
| `__isEmail`    | 验证 - 邮箱   |
| `__isEmptyObj` | 验证 - 空对象 |