首页 > 跪求大神 :react 点击删除li的某一个

跪求大神 :react 点击删除li的某一个

这样写每回点击删除都会产生一个li
让他不产生又会报错,如果给他父级加getInitialState的话有只有一次,请问该如何解决

var ProductionSectionBox=React.createClass({
        getInitialState : function(){
            return {
                flay : true 
            }
        },
        ChangeDevice : function(){
            this.setState({flay: !this.state.flay});
        },
        render : function(){
            var filterArr=this.props.data;
            var key=this.props.key;
            if(this.state.flay){
                return (
                    <li key={key}>
                        {filterArr}
                        <ProductionSectiontool flay={this.ChangeDevice}/>
                    </li>
                )
            }else{
                return (
                    <li></li>
                )
            }
        }
    })
//删除的代码
var ProductionSectiontool=React.createClass({
        handleremove : function(){
            this.props.flay();
        },
        render :function(){
            return(
                <ul className="tool">
                    <li><i className="iconfont">&#xe602;</i></li>
                    <li><i className="iconfont">&#xe601;</i></li>
                    <li onClick={this.handleremove}><i className="iconfont">&#xe600;</i></li>
                </ul>    
            )
            
        }
    })

原先我也碰到过类似的错误,就是返回正确DOM和返回空。
你可以

return null //这样做的话react默认会返回一个<span></span>标签
或是直接返回:
return <span></span>

<ProductionSectiontool flay={this.ChangeDevice}/>

应写为

<ProductionSectiontool flay={this.ChangeDevice.bind(this)}/>

因为这方法里用了this,如不绑定this.setState将报错

【热门文章】
【热门文章】