2017-05-14 155 views
1

我有組件顯示我的用戶配置文件頁面。在這個組件裏面我有一個按鈕。點擊後,此按鈕使用動作功能向我的追隨者顯示另一個組件。React-native中的多個相同狀態的實例

與我的關注者列表中的組件裏面,我可以點擊每個跟隨並與用戶配置文件組件打開他的個人資料,並出示其跟隨者的信息和他的個人資料。一切正常,直到我點擊回來。然後我看到一個不屬於我的追隨者列表,但屬於我剛剛單擊的配置文件。

由於減速器被改寫的狀態,誰我目前看,如果我去其他用戶的追隨者頁面,然後點擊到另一個人,我看到相同的行爲。我想我需要保存以前的用戶的關注者列表和以前的個人檔案,或者可能像複製縮減器中的以前的狀態,但我不知道如何。

我將Wilddog用於我的後端,它與Firebase類似,但用於中國。我已將所有文件附加到下面鏈接的GIST。

看來解決方案應該是顯而易見的,但我沒有得到解決它的竅門。

https://gist.github.com/myfailemtions/0c4b79fef1aa5e6d67d3f828717474f5

回答

1

它看起來對我來說,有問題的代碼可能如下:

class Followers extends Component { 

    componentWillMount() { 
    const {uid} = this.props.user; 
    this.props.followersFetch({uid}); 
    this.createDataSource(this.props) 
    } 

    componentWillReceiveProps(nextProps) { 
     this.createDataSource(nextProps) 
    } 

    // ..omitted 

} 

它看起來像你取當組件坐騎,卻忘記在更新列表道具更新。將this.props.followersFetch(nextProps({this.props.user.uid});添加到componentWillReceiveProps可能會修復該錯誤。

如果你擔心向服務器多次調用,你將需要實現你的減速緩存。現在你的代碼片斷顯示你用跟隨者獲取覆蓋了你的整個狀態(?!) - 這可能不是你想要的。如果你想回滾到以前的狀態,用Immutable.js這樣的庫來存儲你的狀態可能就是你想要的。

編輯

一個快速和骯髒的修改現有的動作來存儲以前的狀態。這樣做需要重構大部分視圖,因爲每當您獲取關注者時,它不會再刪除由reducer管理的所有狀態。

export default (state = INITIAL_STATE, action) => { 
    switch (action.type) { 
     case FOLLOWING_FETCH: 
      //Following lines updates state, rather than rewrites it 
      return { 
        ...state, 
        cachedFollowers: state.cachedFollowers.push(action.payload) 
       }; 
     default: 
      return state 
    } 
}; 

警告:上述代碼是未測試的

相關問題