React js setState（{}）直接修改redux中的數據存儲初始對象

當我設置修改my redux的this.props.setState()時，會存儲initial_state對象。React js setState（{}）直接修改redux中的數據存儲初始對象

以下是我的終極版店：

export const initial_state = {address:{firstName:"",lastName:""}} 
export const store = createStore(reducers,Object.assign({},initial_state));

在我的組件

class AddressForm extends React.Component{ 


constructor(props){ 
super(props) 
this.state = {address:this.props.address}; 
this.onAddressChange = this.onAddressChange.bind(this); 
} 
    onAddressChange(e){ 
    let address = Object.assign({},this.state.address); 
    address["firsName"].value = e.target.value; 
    this.setState({address:address}) 
    } 
    render(){ 
    console.log(this.props.address); 
     return(...having input field with onChange= 
       {this.onAddressChange}....) 
    } 
} 

function mapStateToProps(state){ 
    return({ 
    address:state.address 
    }); 
} 
export default connect()(AddressForm);

按照上面的代碼在控制檯我正在打印從終極版商店this.props.address這個打印值{firstName:"Typed in text box"}

其實我只是在組件的狀態下通過創建新的地址對象和修改只有該狀態val UE。

即使我不分派任何與終極版事件......

但仍修改我intial_state在終極版店爲什麼呢？

在此先感謝球員.....

來源

2017-09-07 Kumar Raj

聲明1：

this.state = {address:this.props.address};您保存店address state的參考。

聲明2：

let address = Object.assign({},this.state.address);

您所創建的全新副本，並在address存儲。

但是，

this.setState({address:address})

不更新從聲明2的address變量而是從聲明1是從終極版商店address state參考更新address。這就是爲什麼您的REDEX商店價值得到更新。

來源

2017-09-07 07:47:19

但在'connect'，尚未明確說明自己'mapStateToProps'，雖然他寫了它。 –

@AjayGaur我在說'this.props.address}'最初未定義，因爲他沒有通過'mapStateToProps'連接' –

我沒有得到。我不知道他是如何運行代碼的。在地址[「firsName」] .value = e.target.value;'，它應該給他錯誤，因爲'不能讀取未定義的值 –

自從我做出反應之後已經有一段時間了，但是最先引起我注意的是mapStateToProps應該被傳遞給connect的初始呼叫。我敢打賭，如果你在構造函數中做了console.log(this.props.address)，它會打印undefined。

另外我不會保存這樣的道具this.state = {address:this.props.address};。而是使用this.state作爲表單值的臨時存儲，然後通過一個操作將它傳遞給表單提交中的存儲。

新來這裏的堆棧溢出貸款援助之手，所以請讓我知道，如果我是anythig不清，或可提供進一步的幫助:)

來源

2017-09-07 07:56:51

React js setState（{}）直接修改redux中的數據存儲初始對象

回答

相關問題