鍍金池/ 問(wèn)答/HTML/ react高階組件包裹的組件如何操作高階組件內(nèi)的state?

react高階組件包裹的組件如何操作高階組件內(nèi)的state?

寫(xiě)了一個(gè)高階組件

const fn=(Com)=>{
    return class A extends Comonents{
        state={
            list
        }
        return <Com  {...this.props}/>
    }
}

const NewCom = fn(Com);
NewCom 如何操作修改 list
回答
編輯回答
伴謊

向子組件傳遞方法,然后在子組件里面調(diào)用該方法。

const fn=(Com)=>{
    return class A extends Component{
        state={
            list
        }
        handleList = () => {
           // to do ...
           this.setState({
             list: ...
           })
        }
        return <Com handleList={this.handleList} {...this.props}/>
    }
}
class Com extends Components {
    state = {}
    handleList = () => this.props.handleList()
    
    return (
        ....
    )
}
2018年4月20日 06:29
編輯回答
不討囍

普通組件怎么操作,高階組件就怎么操作

const fn=(Com)=>{
    return class A extends Comonents{
        state={
            list
        }
        componentDidMount(){
            fetch('/XXX')
            .then(res=>{
                ...
                this.setState({...});
            })
        }
        render(){
            return <Com  {...this.props}/>
        }
    }
}

const NewCom = fn(Com);
2017年3月14日 12:04
編輯回答
孤客

生命周期?props?

2018年6月30日 12:54
編輯回答
吢丕
const fn=(Com)=>{
    return class A extends Comonents{
        state={
            list
        }
        return <Com list={this.state.list} {...this.props}/>
    }
}

2017年7月26日 15:17