Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit adf4c38

Browse files
SeanGroffDamian Sznajder
authored and
Damian Sznajder
committed
add memo component snippets
1 parent 5f8964f commit adf4c38

File tree

2 files changed

+84
-3
lines changed

2 files changed

+84
-3
lines changed

‎README.md

Lines changed: 28 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,6 +59,8 @@ Every space inside `{ }` and `( )` means that this is pushed into next line :)
5959
| `imrcp→` | `import React, { Component } from 'react' & import PropTypes from 'prop-types'` |
6060
| `imrpc→` | `import React, { PureComponent } from 'react'` |
6161
| `imrpcp→` | `import React, { PureComponent } from 'react' & import PropTypes from 'prop-types'` |
62+
| `imrmc→` | `import React, { memo } from 'react'` |
63+
| `imrmcp→` | `import React, { memo } from 'react' & import PropTypes from 'prop-types'` |
6264
| `impt→` | `import PropTypes from 'prop-types'` |
6365
| `redux→` | `import { connect } from 'react-redux'` |
6466
| `rconst→` | `constructor(props) with this.state` |
@@ -256,7 +258,7 @@ export default class FileName extends Component {
256258
import React from 'react'
257259
import PropTypes from 'prop-types'
258260

259-
function 1ドル() {
261+
function 1ドル(props) {
260262
return <div>0ドル</div>
261263
}
262264

@@ -324,6 +326,31 @@ const 1ドル = () => {
324326
export default 1ドル
325327
```
326328

329+
### `rmc`
330+
331+
```javascript
332+
import React, { memo } from 'react'
333+
334+
export default memo(function 1ドル() {
335+
return <div>0ドル</div>
336+
})
337+
```
338+
339+
### `rmcp`
340+
341+
```javascript
342+
import React, { memo } from 'react'
343+
import PropTypes from 'prop-types'
344+
345+
const 1ドル = memo(function 1ドル(props) {
346+
return <div>0ドル</div>
347+
})
348+
349+
1ドル.propTypes = {}
350+
351+
export default 1ドル
352+
```
353+
327354
### `rcredux`
328355

329356
```javascript

‎snippets/snippets.json

Lines changed: 56 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -200,6 +200,21 @@
200200
""
201201
]
202202
},
203+
"import React, { memo }": {
204+
"prefix": "imrmc",
205+
"body": [
206+
"import React, { memo } from 'react'",
207+
""
208+
]
209+
},
210+
"import React, { memo } & PropTypes": {
211+
"prefix": "imrmcp",
212+
"body": [
213+
"import React, { memo } from 'react'",
214+
"import PropTypes from 'prop-types'",
215+
""
216+
]
217+
},
203218
"import PropTypes": {
204219
"prefix": "impt",
205220
"body": ["import PropTypes from 'prop-types'", ""]
@@ -286,7 +301,7 @@
286301
"import React from 'react'",
287302
"import PropTypes from 'prop-types'",
288303
"",
289-
"function ${1:${TM_FILENAME_BASE}}() {",
304+
"function ${1:${TM_FILENAME_BASE}}(props) {",
290305
" return (",
291306
" <div>",
292307
" 0ドル",
@@ -344,7 +359,7 @@
344359
"import React from 'react'",
345360
"import PropTypes from 'prop-types'",
346361
"",
347-
"const ${1:${TM_FILENAME_BASE}} = () => {",
362+
"const ${1:${TM_FILENAME_BASE}} = props => {",
348363
" return (",
349364
" <div>",
350365
" 0ドル",
@@ -428,6 +443,45 @@
428443
],
429444
"description": "Creates a React component class with ES7 module system"
430445
},
446+
"reactFunctionMemoComponent": {
447+
"prefix": "rmc",
448+
"body": [
449+
"import React, { memo } from 'react'",
450+
"",
451+
"export default memo(function ${1:${TM_FILENAME_BASE}}() {",
452+
" return (",
453+
" <div>",
454+
" 0ドル",
455+
" </div>",
456+
" )",
457+
"})",
458+
""
459+
],
460+
"description": "Creates a React Memo Function Component with ES7 module system"
461+
},
462+
"reactFunctionMemoComponentWithPropTypes": {
463+
"prefix": "rmcp",
464+
"body": [
465+
"import React, { memo } from 'react'",
466+
"import PropTypes from 'prop-types'",
467+
"",
468+
"const ${1:${TM_FILENAME_BASE}} = memo(function ${1:${TM_FILENAME_BASE}}(props) {",
469+
" return (",
470+
" <div>",
471+
" 0ドル",
472+
" </div>",
473+
" )",
474+
"})",
475+
"",
476+
"${1:${TM_FILENAME_BASE}}.propTypes = {",
477+
"",
478+
"}",
479+
"",
480+
"export default ${1:${TM_FILENAME_BASE}}",
481+
""
482+
],
483+
"description": "Creates a React Memo Function Component with ES7 module system with PropTypes"
484+
},
431485
"reactClassCompomentPropTypes": {
432486
"prefix": "rccp",
433487
"body": [

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /