React Snippets

javascriptreact.json

{
/*
	// Place your snippets for JavaScript React here. Each snippet is defined under a snippet name and has a prefix, body and 
	// description. The prefix is what is used to trigger the snippet and the body will be expanded and inserted. Possible variables are:
	// $1, $2 for tab stops, $0 for the final cursor position, and ${1:label}, ${2:another} for placeholders. Placeholders with the 
	// same ids are connected.
	// Example:
	"Print to console": {
		"prefix": "log",
		"body": [
			"console.log('$1');",
			"$2"
		],
		"description": "Log output to console"
	}
*/
	"Component Static Default Props": {
		"prefix": "_defaultProps",
		"body": "static defaultProps = {$0};",
	},

	"Component Static Get Derived State From Props": {
		"prefix": "_getDerivedStateFromProps",
		"body": "static getDerivedStateFromProps(${1:nextProps}, ${2:prevState}) {$0}"
	},

	"Component Set State": {
		"prefix": "_setState",
		"body": "this.setState($1);$0",
	},

	"Component Constructor": {
		"prefix": "_constructor",
		"body": [
			"constructor(${1:props}) {",
			"\tsuper(${1:props});",
			"",
			"\t$4",
			"}",
		],
	},

	"Component Will Mount": {
		"prefix": "_componentWillMount",
		"body": "componentWillMount() {$0}",
		"description": "DEPRECATION WARNING [v16.3]: Use `componentDidMount` instead."
	},

	"Component Did Mount": {
		"prefix": "_componentDidMount",
		"body": "componentDidMount() {$0}",
	},

	"Component Will Receive Props": {
		"prefix": "_componentWillReceiveProps",
		"body": "componentWillReceiveProps(${1:nextProps}) {$0}",
		"description": "DEPRECATION WARNING [v16.3]: Use `static getDerivedStateFromProps` instead."
	},

	"Should Component Update": {
		"prefix": "_shouldComponentUpdate",
		"body": "shouldComponentUpdate(${1:nextProps}, ${2:nextState}) {$0}",
	},

	"Component Will Update": {
		"prefix": "_componentWillUpdate",
		"body": "componentWillUpdate(${1:nextProps}, ${2:nextState}) {$0}",
		"description": "DEPRECATION WARNING [v16.3]: Use `componentDidUpdate` instead."
	},

	"Component Did Update": {
		"prefix": "_componentDidUpdate",
		"body": "componentDidUpdate(${1:nextProps}, ${2:state}) {$0}",
	},

	"Component Will Unmount": {
		"prefix": "_componentWillUnmount",
		"body": "componentWillUnmount() {$0}",
	},

	"Component Did Catch": {
		"prefix": "_componentDidCatch",
		"body": "componentDidCatch(${1:error}, ${2:errorInfo}) {$0}",
	},

	"Component Render": {
		"prefix": "_render",
		"body": [
			"render() {",
			"\treturn ($0);",
			"}"
		],
	}
}