Method | Side effects1 | State updates2 | Example uses |
---|---|---|---|
Mounting | |||
componentWillMount |
✓ | Constructor equivalent for createClass |
|
render |
Create and return element(s) | ||
componentDidMount |
✓ | ✓ | DOM manipulations, network requests, etc. |
Updating | |||
componentWillReceiveProps |
✓ | Update state based on changed props |
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
// Licensed under a CC0 1.0 Universal (CC0 1.0) Public Domain Dedication | |
// http://creativecommons.org/publicdomain/zero/1.0/ | |
(function (win, doc) { | |
// Cut the mustard. | |
if (!win.localStorage) return; | |
// You should probably use a more specific selector than this. | |
var textarea = doc.querySelector('textarea'); | |
// The key for the key/value pair in localStorage is the current URL. | |
var key = win.location.href; |
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 ReactDOMServer from 'react-dom/server'; | |
export function encodeSvg(reactElement) { | |
return 'data:image/svg+xml,' + escape(ReactDOMServer.renderToStaticMarkup((reactElement))); | |
} |
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 { render } from "react-dom"; | |
const ParentComponent = React.createClass({ | |
getDefaultProps: function() { | |
console.log("ParentComponent - getDefaultProps"); | |
}, | |
getInitialState: function() { | |
console.log("ParentComponent - getInitialState"); | |
return { text: "" }; |