57 lines
1.3 KiB
Text
57 lines
1.3 KiB
Text
|
global !p
|
||
|
|
# Capitalize the first letter without affecting the rest of the letters
|
||
|
|
def capitalize_first(word):
|
||
|
|
if(word):
|
||
|
|
word = word[0].upper() + word[1:]
|
||
|
|
return word
|
||
|
|
endglobal
|
||
|
|
|
||
|
|
# Functional components
|
||
|
|
snippet rfc "react functional component" b
|
||
|
|
import React, {useState} from "react"
|
||
|
|
|
||
|
|
function ${1:`!p snip.rv = snip.basename`}(${2}){
|
||
|
|
return(
|
||
|
|
<div>
|
||
|
|
${3:<p>Body</p>}
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
export default $4`!p snip.rv = snip.basename`
|
||
|
|
endsnippet
|
||
|
|
# React Hooks
|
||
|
|
snippet useS "useState Hook" b
|
||
|
|
const [${1}, set`!p snip.rv=capitalize_first(t[1])`] = useState(${3:"${4}"})
|
||
|
|
endsnippet
|
||
|
|
snippet useE "useEffect Hook" b
|
||
|
|
useEffect(() => {
|
||
|
|
${1:${0}}
|
||
|
|
}${2})
|
||
|
|
endsnippet
|
||
|
|
snippet useC "useContext Hook" b
|
||
|
|
const ${1:context} = useContext(${2})
|
||
|
|
endsnippet
|
||
|
|
snippet useRe "useReducer Hook" b
|
||
|
|
const [${3:state}, ${4:dispatch}] = useReducer(${5:reducer}, ${2:initial_value})
|
||
|
|
endsnippet
|
||
|
|
snippet useCB "useCallback(fn, inputs)" b
|
||
|
|
const ${1:callback} = useCallback((${2})) => ${3:{
|
||
|
|
${4}
|
||
|
|
}}, [${5}])
|
||
|
|
endsnippet
|
||
|
|
snippet useM "useMemo(fn, inputs)" b
|
||
|
|
const ${1:memorized} = useMemo(() => ${2:{
|
||
|
|
${3}
|
||
|
|
}}, [${4}])
|
||
|
|
endsnippet
|
||
|
|
snippet useR "useRef(defaultValue)" b
|
||
|
|
const ${1:ref} = useRef(${2:null})
|
||
|
|
endsnippet
|
||
|
|
snippet ir "import React"
|
||
|
|
import React from "react"
|
||
|
|
endsnippet
|
||
|
|
snippet irc "import React and Component"
|
||
|
|
import React, { Component } from "react"
|
||
|
|
endsnippet
|