React- FLUX - 將對象作爲參數傳遞 - 未定義

我有一個簡單的反應應用程序，我從web api獲取聯繫人列表，我想要顯示它們。每個聯繫人都有一個名字，姓氏，電話等我的應用程序類獲取聯繫人，然後呈現爲React- FLUX - 將對象作爲參數傳遞 - 未定義

render(){ 
var contact= this.state.contacts[0]; 
return(<div><Contact label='First Contact' person={contact}/></div> 
) 
}

然後在我的聯繫類

render(){ 
return(
<div> {this.props.label} : {this.props.person.Name}</div>) 
}

當我調試的鉻，我看到那個人作爲道具被傳遞，對象具有的所有參數，但是當我運行的代碼，在{} this.props.person.Name我遇到錯誤

Cannot read property Name of undefined

如果我刪除，{this.props.label }顯示沒有問題。所以我可以傳遞文本作爲道具而不是對象。有什麼想法？

編輯：我還可以傳遞的名稱屬性作爲聯繫PERSONNAME = {contact.Name} /> 這工作，但沒有通過接觸作爲對象，然後在渲染的

來源

2017-06-15 user2026343

讀取屬性

我的猜測是（因爲你使用的是流量），在加載頁面時（初始加載），狀態中的聯繫人表示一個空數組。

嘗試

var contact= this.state.contacts[0] || {};

和一些好的建議=>不使用瓦爾，都使用const :-)

讓你的組件聽你的流量店：

確保您的flux store擁有addChangeListener和removeChangeListener功能，您可以在組件中調用，以便您的組件自動更新

componentDidMount(){ 
    myStore.addChangeListener(this._onChange); 
} 

componentWillUnmount(){ 
    myStore.removeChangeListener(this._onChange); 
} 

_onChange =() => { 
    this.setState({contacts: myStore.getContacts()}); 
}

來源

2017-06-15 13:35:48 Schuere

謝謝，我有您提到的代碼位，但父級別的狀態不爲空，我可以做alert（this.state.documents.length） – user2026343

我只是遵循'爲了一些好的提示=>不要使用變量，使用const :-)' 它的工作！顯然，如果我將對象定義爲var並傳遞爲prop，那麼我不能轉到子組件中的Json對象的屬性，但是如果將該對象定義爲const，則沒有問題。謝謝 – user2026343

React- FLUX - 將對象作爲參數傳遞 - 未定義

回答

相關問題