The essentials
1.
2.
3.
4.
Class components
[Link](type, props, children)
Create a ReactElementwith the given component class, propsand
children.
var link = [Link]('a', {href: '#'}, "Save")
var nav = [Link](MyNav, {flat: true}, link)
[Link](element, props, children)
Create a new ReactElement, merging in new propsand children.
[Link](element, domNode)
Take a ReactElement, and render it to a DOM node. E.g.
[Link](
[Link]('div'),
[Link]('container')
)
var MyComponent = [Link]({
displayName: 'MyComponent',
/* ... options and lifecycle methods ... */
render: function() {
return [Link]( /* ... */ )
},
})
Options
propTypes
getDefaultProps
getInitialState
Lifecycle Methods
[Link](element)
Return the DOM node corresponding to the given element (after render).
Special props
is automatically added to [Link] [Link].
corresponds to the HTML classattribute.
corresponds to the HTML forattribute.
uniquely identifies a ReactElement. Used with elements in arrays.
accepts a callback function which will be called:
1. with the component instance or DOM node on mount.
2. with nullon unmount and when the passed in function changes.
styleaccepts an object of styles, instead of a string.
children
className
htmlFor
key
ref
componentWillMount
componentDidMount
componentWillReceiveProps
shouldComponentUpdate
componentWillUpdate
componentDidUpdate
componentWillUnmount
Available under [Link]. Optionally append .isRequired.
array
bool
element
node
number
object
string
instanceOf(constructor)
oneOf(['News', 'Photos'])
oneOfType([propType, propType])
func
function()
function()
function(nextProps)
function(nextProps, nextState)
function(nextProps, nextState)
function(prevProps, prevState)
function()
-> bool
Component instances
Accessible as thiswithin class components
Stateless functional components do not have component instances.
Serve as the object passed to refcallbacks
One component instance may persist over multiple equivalent ReactElements.
Properties
propTypes
any
mapping prop names to types
returning object
returning object
object
function()
function()
contains any props passed to [Link]
contains state set by setStateand getInitialState
props
state
Methods
1. setState(changes)applies the given changes to [Link] re-renders
2. forceUpdate()immediately re-renders the component to the DOM
2016 James K Nelson - [Link]
