| Name of thing | Sorta like... | Mounted? | Can you even setState? | What would you say... ya do here? |
|---|---|---|---|---|
| constructor | initialize() | nope | nope | init stuff NO side effects |
| componentWillMount | beforeDomReady() | nope | yeah but don't | Only needed in createClass now use constructor for most things |
| render | render | nope | please no | render stuff and don't set any state please |
| componentDidMount | domReady() | yup | yup | DOM is a go init jQuery plugins dispatch stuff |
| componentWillReceiveProps | onChange() | yup | yup |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| const copyToClipboard = str => { | |
| const el = document.createElement('textarea'); // Create a <textarea> element | |
| el.value = str; // Set its value to the string that you want copied | |
| el.setAttribute('readonly', ''); // Make it readonly to be tamper-proof | |
| el.style.position = 'absolute'; | |
| el.style.left = '-9999px'; // Move outside the screen to make it invisible | |
| document.body.appendChild(el); // Append the <textarea> element to the HTML document | |
| const selected = | |
| document.getSelection().rangeCount > 0 // Check if there is any content selected previously | |
| ? document.getSelection().getRangeAt(0) // Store selection if found |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| import React from 'react'; | |
| import injectStyle from './path/to/injectStyle'; | |
| export default class SampleComponent extends React.Component { | |
| constructor(props) { | |
| super(props); | |
| const keyframesStyle = ` | |
| @-webkit-keyframes pulse { | |
| 0% { background-color: #fecd6d; } |