首頁猿問新手上路,React...

新手上路,React 子組件怎么同步父級的props求指導！

JavaScript

qq_笑_17 2019-11-03 15:47:30

想要初始化的時候同步一個props到自己內部，這個狀態(tài)交給自己管理，然后父級更新的時候也同步props到組件內部，React中怎么實現(xiàn)？比如一個input組件，父級傳過來value進來，這時候給input組件內部管理，用戶怎么輸入都不會影響父級的value。當點擊確定的時候，再把這個狀態(tài)告訴父級。

查看完整描述

2 回答

梵蒂岡之花

TA貢獻1900條經(jīng)驗獲得超5個贊

`classInputextendsComponent{constructor(props){super(props);this.state={value:''}this.changeHandle=this.changeHandle.bind(this);this.submit=this.submit.bind(this);}changeHandle(e){this.setState({value:e.target.value});}submit(e){this.props.save(this.state.value);}render(){return(submit
)}staticgetDerivedStateFromProps(nextProps,preState){if(preState.value){returnnull;}return{value:nextProps.initValue}}}classAppextendsComponent{constructor(props){super(props);this.state={value:'init'}this.changeHandle=this.changeHandle.bind(this);}changeHandle(value){this.setState({value});}render(){return(父:{this.state.value}
)}}`這樣試試

反對回復 2019-11-03

楊魅力

TA貢獻1811條經(jīng)驗獲得超6個贊

簡單點，父組件props同步到子組件，然后子組件內部做狀態(tài)管理，這個你應該回了，就是把props上的值賦值給子組件的state當父組件props方式變化的時候，需要重置子組件的，這個時候做法比較粗暴的就是，直接重新渲染子組件，重新渲染子組件的最簡單的做法，就是修改子組件的key就好了子組件值變化了，同步給到父組件，通過props傳遞個更新的方法到子組件就好了需要注意的問題：2和3如果都是通過觀察值的變化觸發(fā)執(zhí)行，就是個死循環(huán)。所以需要想辦法把2和3分開執(zhí)行

反對回復 2019-11-03