menor · August 29, 2015 14:25 · Sep 13, 2014 · Sep 13, 2014 · Sep 13, 2014 · Sep 13, 2014
diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -1,4 +1,9 @@
-var MyReactComponent = React.createClass({
+/**
+ * @jsx React.DOM
+ */
+
+var React = require('react'),
+    MyReactComponent = React.createClass({
 
     // The object returned by this method sets the initial value of this.state
     getInitialState: function(){
@@ -15,10 +20,7 @@ var MyReactComponent = React.createClass({
     // Inspects this.state and this.props create the markup
     // Should never update this.state or this.props
     render: function(){
-        console.log('render');
-    	return (<div>
-            <input type="button" onClick={this._handleClick}/>
-        </div>);
+    	return (<div></div>);
     },
 
     // An array of objects each of which can augment the lifecycle methods
@@ -34,19 +36,16 @@ var MyReactComponent = React.createClass({
     // Invoked once before first render
     componentWillMount: function(){
     	// Calling setState here does not cause a re-render
-        console.log('componentWillMount');
     },
 
     // Invoked once after the first render
     componentDidMount: function(){
-        console.log('componentDidMount');
     	// You now have access to this.getDOMNode()
     },
 
     // Invoked whenever there is a prop change
     // Called BEFORE render
     componentWillReceiveProps: function(nextProps){
-        console.log('componentWillReceiveProps');
     	// Not called for the initial render
     	// Previous props can be accessed by this.props
     	// Calling setState here does not trigger an an additional re-render
@@ -56,32 +55,22 @@ var MyReactComponent = React.createClass({
     // Called BEFORE a render
     // Not called for the initial render
     shouldComponentUpdate: function(nextProps, nextState){
-        console.log('shouldComponentUpdate');
     	// If you want the render method to execute in the next step
     	// return true, else return false
+        return true;
     },
 
     // Called IMMEDIATELY BEFORE a render
     componentWillUpdate: function(nextProps, nextState){
-        console.log('componentWillUpdate');
     	// You cannot use this.setState() in this method
     },
 
     // Called IMMEDIATELY AFTER a render
     componentDidUpdate: function(prevProps, prevState){
-        console.log('componentDidUpdate');
     },
 
     // Called IMMEDIATELY before a component is unmounted
     componentWillUnmount: function(){
-        console.log('componentWillUnmount');
-    },
-
-    _handleClick: function(){
-        console.log('==Updating State==')
-        this.setState({
-            'key':'value'
-        });
     }
 
 });

diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -15,7 +15,10 @@ var MyReactComponent = React.createClass({
     // Inspects this.state and this.props create the markup
     // Should never update this.state or this.props
     render: function(){
-    	return (<div></div>);
+        console.log('render');
+    	return (<div>
+            <input type="button" onClick={this._handleClick}/>
+        </div>);
     },
 
     // An array of objects each of which can augment the lifecycle methods
@@ -31,17 +34,19 @@ var MyReactComponent = React.createClass({
     // Invoked once before first render
     componentWillMount: function(){
     	// Calling setState here does not cause a re-render
+        console.log('componentWillMount');
     },
 
     // Invoked once after the first render
     componentDidMount: function(){
-
+        console.log('componentDidMount');
     	// You now have access to this.getDOMNode()
     },
 
     // Invoked whenever there is a prop change
     // Called BEFORE render
     componentWillReceiveProps: function(nextProps){
+        console.log('componentWillReceiveProps');
     	// Not called for the initial render
     	// Previous props can be accessed by this.props
     	// Calling setState here does not trigger an an additional re-render
@@ -51,21 +56,34 @@ var MyReactComponent = React.createClass({
     // Called BEFORE a render
     // Not called for the initial render
     shouldComponentUpdate: function(nextProps, nextState){
+        console.log('shouldComponentUpdate');
     	// If you want the render method to execute in the next step
     	// return true, else return false
     },
 
     // Called IMMEDIATELY BEFORE a render
-    componentWillUpdate: function(nextProps, nextState)){
+    componentWillUpdate: function(nextProps, nextState){
+        console.log('componentWillUpdate');
     	// You cannot use this.setState() in this method
     },
 
     // Called IMMEDIATELY AFTER a render
     componentDidUpdate: function(prevProps, prevState){
-
+        console.log('componentDidUpdate');
     },
 
     // Called IMMEDIATELY before a component is unmounted
-    componentWillUnmount: function(){}
+    componentWillUnmount: function(){
+        console.log('componentWillUnmount');
+    },
+
+    _handleClick: function(){
+        console.log('==Updating State==')
+        this.setState({
+            'key':'value'
+        });
+    }
+
+});
 
-});
+module.exports = MyReactComponent;
diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -41,7 +41,7 @@ var MyReactComponent = React.createClass({
 
     // Invoked whenever there is a prop change
     // Called BEFORE render
-    componentWillReceiveProps: function(object nextProps){
+    componentWillReceiveProps: function(nextProps){
     	// Not called for the initial render
     	// Previous props can be accessed by this.props
     	// Calling setState here does not trigger an an additional re-render
@@ -50,18 +50,18 @@ var MyReactComponent = React.createClass({
     // Determines if the render method should run in the subsequent step
     // Called BEFORE a render
     // Not called for the initial render
-    shouldComponentUpdate: function(object nextProps, object nextState){
+    shouldComponentUpdate: function(nextProps, nextState){
     	// If you want the render method to execute in the next step
     	// return true, else return false
     },
 
     // Called IMMEDIATELY BEFORE a render
-    componentWillUpdate: function(object nextProps, object nextState)){
+    componentWillUpdate: function(nextProps, nextState)){
     	// You cannot use this.setState() in this method
     },
 
     // Called IMMEDIATELY AFTER a render
-    componentDidUpdate: function(object prevProps, object prevState){
+    componentDidUpdate: function(prevProps, prevState){
 
     },
 

diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -1,19 +1,19 @@
 var MyReactComponent = React.createClass({
 
-	// The object returned by this method sets the initial value of this.state
-		getInitialState: function(){
-			return {};
-		},
-
-		// The object returned by this method sets the initial value of this.props
-		// If a complex object is returned, it is shared among all component instances		
-		getDefaultProps: function(){
-			return {};
-		},
-
-		// Returns the jsx markup for a component
-		// Inspects this.state and this.props create the markup
-		// Should never update this.state or this.props
+    // The object returned by this method sets the initial value of this.state
+    getInitialState: function(){
+    	return {};
+    },
+
+    // The object returned by this method sets the initial value of this.props
+    // If a complex object is returned, it is shared among all component instances		
+    getDefaultProps: function(){
+    	return {};
+    },
+
+    // Returns the jsx markup for a component
+    // Inspects this.state and this.props create the markup
+    // Should never update this.state or this.props
     render: function(){
     	return (<div></div>);
     },
@@ -32,7 +32,7 @@ var MyReactComponent = React.createClass({
     componentWillMount: function(){
     	// Calling setState here does not cause a re-render
     },
-    
+
     // Invoked once after the first render
     componentDidMount: function(){
 
@@ -46,7 +46,7 @@ var MyReactComponent = React.createClass({
     	// Previous props can be accessed by this.props
     	// Calling setState here does not trigger an an additional re-render
     },
-    
+
     // Determines if the render method should run in the subsequent step
     // Called BEFORE a render
     // Not called for the initial render
@@ -57,10 +57,10 @@ var MyReactComponent = React.createClass({
 
     // Called IMMEDIATELY BEFORE a render
     componentWillUpdate: function(object nextProps, object nextState)){
-			// You cannot use this.setState() in this method
-		},
+    	// You cannot use this.setState() in this method
+    },
 
-		// Called IMMEDIATELY AFTER a render
+    // Called IMMEDIATELY AFTER a render
     componentDidUpdate: function(object prevProps, object prevState){
 
     },

diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -1,6 +1,6 @@
 var MyReactComponent = React.createClass({
 
-		// The object returned by this method sets the initial value of this.state
+	// The object returned by this method sets the initial value of this.state
 		getInitialState: function(){
 			return {};
 		},

diff --git a/MyReactComponent.js b/MyReactComponent.js
@@ -0,0 +1,71 @@
+var MyReactComponent = React.createClass({
+
+		// The object returned by this method sets the initial value of this.state
+		getInitialState: function(){
+			return {};
+		},
+
+		// The object returned by this method sets the initial value of this.props
+		// If a complex object is returned, it is shared among all component instances		
+		getDefaultProps: function(){
+			return {};
+		},
+
+		// Returns the jsx markup for a component
+		// Inspects this.state and this.props create the markup
+		// Should never update this.state or this.props
+    render: function(){
+    	return (<div></div>);
+    },
+
+    // An array of objects each of which can augment the lifecycle methods
+    mixins: [],
+
+    // Functions that can be invoked on the component without creating instances
+    statics: {
+    	aStaticFunction: function(){}
+    },
+
+    // -- Lifecycle Methods --
+
+    // Invoked once before first render
+    componentWillMount: function(){
+    	// Calling setState here does not cause a re-render
+    },
+
+    // Invoked once after the first render
+    componentDidMount: function(){
+
+    	// You now have access to this.getDOMNode()
+    },
+
+    // Invoked whenever there is a prop change
+    // Called BEFORE render
+    componentWillReceiveProps: function(object nextProps){
+    	// Not called for the initial render
+    	// Previous props can be accessed by this.props
+    	// Calling setState here does not trigger an an additional re-render
+    },
+
+    // Determines if the render method should run in the subsequent step
+    // Called BEFORE a render
+    // Not called for the initial render
+    shouldComponentUpdate: function(object nextProps, object nextState){
+    	// If you want the render method to execute in the next step
+    	// return true, else return false
+    },
+
+    // Called IMMEDIATELY BEFORE a render
+    componentWillUpdate: function(object nextProps, object nextState)){
+			// You cannot use this.setState() in this method
+		},
+
+		// Called IMMEDIATELY AFTER a render
+    componentDidUpdate: function(object prevProps, object prevState){
+
+    },
+
+    // Called IMMEDIATELY before a component is unmounted
+    componentWillUnmount: function(){}
+
+});
No results found