snippets/snippets.json

{
    "import": {
        "prefix": "imp",
        "body": ["import ${2:moduleName} from '${1:module}'"],
        "description": "normal import"
    },
    "import module": {
        "prefix": "imd",
        "body": ["import { $2 } from '${1:module}'"],
        "description": "importDestructing"
    },
    "import everything": {
        "prefix": "ime",
        "body": ["import * as ${2:alias} from '${1:module}'"],
        "description": "importEverything"
    },
    "exportDefault": {
        "prefix": "exp",
        "body": ["export default $1"],
        "description": "export default"
    },
    "consoleLog": {
        "prefix": "clg",
        "body": ["console.log(${1:data})"],
        "description": "console log"
    },
    "destructuringAssignment": {
        "prefix": "deas",
        "body": ["const { ${2:prop} } = ${1:object}"],
        "description": "destructuring assignment"
    },

    "import React": {
        "prefix": "imr",
        "body": ["import React, {} from 'react'"],
        "description": "import React"
    },
    "useState": {
        "prefix": "useState",
        "body": [
            "const [${1:state}, set${1/(.*)/${1:/capitalize}/}] = useState(${2:initialState})"
        ],
        "description": "useState"
    },
    "useEffect": {
        "prefix": "useEffect",
        "body": ["useEffect(() => {\n\t${1:effect}\n}, [${2:dep}])"],
        "description": "useEffect"
    },
    "useContext": {
        "prefix": "useContext",
        "body": ["const ${1:context} = useContext(${2:ContextValue})"],
        "description": "useContext"
    },
    "reduxActionCreator": {
        "prefix": "rxaction",
        "body": ["export const ${1:actionName} = (payload) => ({\n\ttype: ${2:type},\n\tpayload\n})"],
        "description": "reduxActionCreator"
    },
    "useDispatch": {
        "prefix": "useDispatch",
        "body": ["const dispatch = useDispatch()"],
        "description": "useDispatch"
    },
    "useSelector": {
        "prefix": "useSelector",
        "body": ["const ${1:state} = useSelector(state => state.$1)"],
        "description": "useSelector"
    },
    "useMount": {
        "prefix": "useMount",
        "body": ["useMount(() => {\n\t${1:fn}\n})"],
        "description": "useMount"
    },
    "useUnmount": {
        "prefix": "useUnmount",
        "body": ["useUnmount(() => {\n\t${1:fn}\n})"],
        "description": "useUnmount"
    },
    "useSetState": {
        "prefix": "useSetState",
        "body": [
            "const [state, setState] = useSetState(${1:initialState})"
        ],
        "description": "useSetState"
    },
    "useBoolean": {
        "prefix": "useBoolean",
        "body": [
            "const [${1}, { toggle, setTrue, setFalse }] = useBoolean(${2)"
        ],
        "description": "useBoolean"
    },
    "useToggle": {
        "prefix": "useToggle",
        "body": [
            "const [${1}, { toggle, set, setLeft, setRight }] = useToggle(${2}, ${3})"
        ],
        "description": "useToggle"
    },
    "useCookieState": {
        "prefix": "useCookieState",
        "body": [
            "const [${1}, set${1}] = useCookieState('${3:key}')"
        ],
        "description": "useCookieState"
    },
    "useLocalStorageState": {
        "prefix": "useLocalStorageState",
        "body": [
            "const [${1}, set${1}] = useLocalStorageState('${3:key}')"
        ],
        "description": "useLocalStorageState"
    },
    "useSessionStorageState": {
        "prefix": "useSessionStorageState",
        "body": [
            "const [${1}, set${1}] = useSessionStorageState('${3:key}')"
        ],
        "description": "useSessionStorageState"
    },
    "useDebounce": {
        "prefix": "useDebounce",
        "body": [
            "const ${2:debounceVal} = useDebounce(${1:value}, { wait: 1000 })"
        ],
        "description": "useDebounce"
    },
    "useDebounceFn": {
        "prefix": "useDebounceFn",
        "body": [
            "const { run, cancel, flush } = useDebounceFn(() => {\n\t${1:fn}\n},, { wait: 1000 })"
        ],
        "description": "useDebounceFn"
    },
    "useThrottle": {
        "prefix": "useThrottle",
        "body": [
            "const ${2} = useThrottle(${1}, { wait: 1000 })"
        ],
        "description": "useThrottle"
    },
    "useThrottleFn": {
        "prefix": "useThrottleFn",
        "body": [
            "const { run, cancel, flush } = useThrottleFn(() => {\n\t${1:fn}\n},, { wait: 1000 })"
        ],
        "description": "useThrottleFn"
    },
    "functionComponentWithUmi": {
		"prefix": "tsx",
		"body": [
			"// $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE - by dev",
			"\n",
			"import { FC } from 'react'",
			"import { connect, ConnectProps } from 'umi'",
			"import styles from './index.less'",
            "\n",
            "interface I${1:component} extends ConnectProps {",
            "}",
            "\n",
            "const ${1:component}: FC<I${1:component}> = (props) => {",
            "    return (",
            "      <div className={styles.${1:component}}>${1:component}</div>",
            "    )",
            "  }",
            "\n",
            "export default connect(({}: {}) => ({",
            "}))(${1:component})"
		],
		"description": "umi 函数组件模板"
	},
    "umiModel": {
		"prefix": "mts",
		"body": [
      "// $CURRENT_YEAR-$CURRENT_MONTH-$CURRENT_DATE - by dev",
			"import { ImmerReducer, Effect } from 'umi';",
			"import { SubscriptionsMapObject } from 'dva';",
			"\n",
			"export interface ${1:component}ModelState {",
			"}",
			"\n",
			"export interface ${1:component}ModelType {",
			"    namespace: '${1:component}';",
			"    state: ${1:component}ModelState;",
			"    effects: {",
			"    };",
			"    reducers: {",
			"        save: ImmerReducer<${1:component}ModelState>;",
			"        reset: ImmerReducer<${1:component}ModelState>;",
  			"    };",
			"    subscriptions: SubscriptionsMapObject;",
			"}",
			"\n",
			"const initialState: ${1:component}ModelState = {",
			"}",
			"\n",
			"const ${1:component}Model: ${1:component}ModelType = {",
			"    namespace: '${1:component}',",
			"    state: initialState,",
			"    effects: {",
			"        // *demo({ payload }, { call, put }) {",
			"        //    const response = yield call(getCaseForm, payload);",
			"        //    yield put({",
			"        //        type: 'save',",
			"        //        payload: response,",
			"        //    });",
			"        //},",
			"    },",
			"    reducers: {",
			"        save(state, { payload }: any) {",
			"            return { ...state, ...payload }",
			"        },",
			"        reset(state, { payload }: any) {",
			"            return {  ...initialState }",
			"        }",
			"    },",
			"    subscriptions: {}",
			"};",
			"\n",

			"export default ${1:component}Model;"
		]
	}
}