React--Component API

13 Jun 2015

                    
                    //1.setState
                    //a.There is no guarantee of synchronous operation of calls to setState
                    //b.setState() will always trigger a re-render unless conditional rendering logic is implemented in shouldComponentUpdate()
                    var Hello = React.createClass({
                      getInitialState:function(){
                        return{
                          text: "first",
                        }
                      },
                      clickH: function(){
                        this.setState({
                          text: "second",
                        });
                        //it will be first,that means no synchronous
                        console.log(this.state.text);
                      },
                      forceUpdateP: function(){
                        this.state.text = "third";
                        console.log(this.state.text);
                        //3.forceUpdate
                        //it is third, but no render, so you need forceUpdate
                        this.forceUpdate();
                        //it will call render method force.less use!
                      },
                      render:function(){
                        return(
                          <div>
                            <h1 onClick={this.clickH}>{this.state.text}</h1>
                            <p onClick={this.forceUpdateP}>test deleteMe!!!</p>
                          </div>
                        );
                      }
                    });

                    //2.replaceState
                    //It may be removed entirely in a future version of React.

                    //3.getDOMNode
                    //getDOMNode is deprecated and has been replaced with React.findDOMNode().
                    //It may be removed entirely in a future version of React.

                    //4.isMounted
                    //isMounted() returns true if the component is rendered into the DOM, false otherwise
                    //You can use this method to guard asynchronous calls to setState() or forceUpdate().

                    //5.setProps
                    //It may be removed entirely in a future version of React.

                    //6.replaceProps
                    //It may be removed entirely in a future version of React.


                    React.render(
                      <Hello />,
                      document.getElementById("test1")
                    );

                    //just 2 APIs can stay: setState and forceUpdate