reactjs code not working

0 Alayna Fender · September 19, 2016
just now I am studying react js and I stuck in that code it display properly but when I click on edit button nothing happens. can any one tell me how to solve it
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="utf-8" />
    <title>React Tutorial</title>
    <script src="https://unpkg.com/react@15.3.1/dist/react.js"></script>
    <script src="https://unpkg.com/react-dom@15.3.1/dist/react-dom.js"> </script>
    <script src="https://unpkg.com/babel-core@5.8.38/browser.min.js"></script>
    </head>
    <body>
    <div id="content"></div>

    <script type="text/babel">

    var CommentBox = React.createClass({
    getInitialState:function()
    {
      return{editing : false}
    },
    save:function()
    {
        this.setState({editing:false});
    },
    edit:function()
    {
        this.setState({editing:true});
    },
    rendernormal : function()
    {
        return (<div>
            <p>{this.props.children}</p>
            <button onClick={this.edit}>Edit</button>
        </div>);
    },
    renderform : function()
    {
        return (<div>
            <textarea defaultValue={this.props.children}></textarea>
            <button onClick={this.save}>Save</button>
        </div>);
    },
    render : function()
    {

        if(this.setState.editing)
        {
            return this.renderform();
        }else
        {
            return this.rendernormal();
        }

    }



    });

    ReactDOM.render(<div>
    <CommentBox>this is for 1st text</CommentBox>
    <CommentBox>this is for 2nd text</CommentBox>
    </div>,document.getElementById('content'));

    </script>
    </body>
    </html>                

Post a Reply

Replies

Oldest  Newest  Rating
0 Steve Kane · September 28, 2016
Just need to change the line:

if(this.setState.editing)
// to
if(this.state.editing)


Steve
  • 1

Javascript

131,186 followers
About

A scripting language that is added to standard HTML to create interactive effects, apps, games for the browser.

Links
Moderators