Tags and Attributes

Supported Elements React attempts to support all common elements in both HTML and SVG. Any lower case tag in JSX will be rendered to an element with that tag. SVG elements must be contained within an <svg> element to work properly. Using React.DOM Factory methods If you aren't using JSX and are using the React.DOM.* API to create elements, then you are slightly more limited and there is list of supported elements that will be available on that API. HTML Elements The following HTML e

React.Component

React.Component class Component This is the base class for React Components when they're defined using ES6 classes. See Reusable Components for how to use ES6 classes with React. For what methods are actually provided by the base class, see the Component API.

Forms

Form components such as <input>, <textarea>, and <option> differ from other native components because they can be mutated via user interactions. These components provide interfaces that make it easier to manage forms in response to user interactions. For information on events on <form> see Form Events. Interactive Props Form components support a few props that are affected via user interactions: value, supported by <input> and <textarea> components. check

React.isValidElement

React.isValidElement boolean isValidElement(* object) Verifies the object is a ReactElement.

getInitialState

getInitialState object getInitialState() Invoked once before the component is mounted. The return value will be used as the initial value of this.state.

Package Management

CDN-hosted React We provide CDN-hosted versions of React on our download page. These pre-built files use the UMD module format. Dropping them in with a simple <script> tag will inject the React and ReactDOM globals into your environment. It should also work out-of-the-box in CommonJS and AMD environments. Using React from npm You can use React with a CommonJS module system like browserify or webpack. Use the react and react-dom npm packages. // main.js var React = require('react'); va

Server-side Environments

One of the great things about React is that it doesn't require the DOM as a dependency, which means it is possible to render a React application on the server and send the HTML markup down to the client. There are a few things that React expects, so this guide will help you get started in your preferred environment. Node.js Node.js is a popular JavaScript runtime that comes with an extensive core library and support for installing packages from npm to expand on the basic functionality. As we'

Cloning ReactElements

Note: cloneWithProps is deprecated. Use React.cloneElement instead. In rare situations, you may want to create a copy of a React element with different props from those of the original element. One example is cloning the elements passed into this.props.children and rendering them with different props: var cloneWithProps = require('react-addons-clone-with-props'); var _makeBlue = function(element) { return cloneWithProps(element, {style: {color: 'blue'}}); }; var Blue = React.createClass({

componentDidUpdate

Updating: componentDidUpdate void componentDidUpdate( object prevProps, object prevState ) Invoked immediately after the component's updates are flushed to the DOM. This method is not called for the initial render. Use this as an opportunity to operate on the DOM when the component has been updated.

Special Non-DOM Attributes

Beside DOM differences, React offers some attributes that simply don't exist in DOM. key: an optional, unique identifier. When your component shuffles around during render passes, it might be destroyed and recreated due to the diff algorithm. Assigning it a key that persists makes sure the component stays. See more here. ref: see here. dangerouslySetInnerHTML: Provides the ability to insert raw HTML, mainly for cooperating with DOM string manipulation libraries. See more here.