Bigboss
Bigboss

Reputation: 345

This.setState causes the browser to hang + Reactjs

var columns = []
    for (var key in this.props.col)
    {
        if (this.state.isEditing){
            columns.push(<td key = {key.id}><input ref = "txt" type = "text" value = { this.state.itemValue } onChange = { this.onTextChange.bind(this) } /></td>)
        }
        else
        {
            columns.push(<td key = {key.id}>{ this.props.col[key] }</td>)
            // this.setState({
            //  itemValue: key,
            //  isEditing: false
            // })
            console.log(key)
        }
        console.log(key);
    }
    return columns

Every time I uncomment this lines:

// this.setState({
            //  itemValue: key,
            //  isEditing: false
            // })

It causes the browser to hang. And a modal message shows up on the browser which says "a script on this page may be busy" and asking me whether to stop the script or continue. Thanks.

Upvotes: 0

Views: 714

Answers (1)

Ji aSH
Ji aSH

Reputation: 3457

Every time you 'setState', your component will rerender, and I guess your function is called during the rendering phase (since it seems to build columns)

Upvotes: 1

Related Questions