2017-02-24 73 views
0

說我的主頁上呈現的所有帖子的飼料在沒有用戶登錄,使其他有關職位的飼料登錄的用戶。焊劑我只想有一個函數如何改變狀態應該重新渲染相對於通量的減少?

getNewFeedPosts(){ 
    this.setState({posts: []}); 
    ajaxFetchPostsFromServer(); 
} 

並將其添加爲一個監聽我的會話存儲。我還會有一個函數監聽我的博客商店,一旦他們回來響應ajaxFetchPostsFromServer被調用,就會將狀態設置爲新帖子。

什麼是最好的實踐方式與連接器和一個供應商做到這一點的終極版?

目前,我有一個飼料容器:

const mapStateToProps = (state) => ({ 
    tweets: state.tweets, 
}); 

const mapDispatchToProps = (dispatch) => ({ 
    getTweets: (currUserId) => { 
     return dispatch(fetchAllTweets(currUserId)); 
    } 
}); 

const FeedContainer = connect(mapStateToProps, mapDispatchToProps)(Feed); 

的飼料:

class Feed extends React.Component { 
    constructor(props) { 
     super(props); 
    } 
    componentWillMount(){ 
     this.props.getTweets(); 
    } 
    render(){ 
     const tweets = this.props.tweets; 
     const originalTweetIds = Object.keys(tweets); 
     return (
       <div> 
        <ul> 
         { originalTweetIds.map((originalTweetId) => { 

          return (
           <li key={originalTweetId}> 
            {post info goes here} 
           </li>); 
         })} 
        </ul> 
       </div> 
     ) 
    } 
}; 

1)現在我打電話getTweets當飼料的即將上馬,只是如果我改變會話狀態在另一個組件中,Feed並沒有改變,我想因爲它不是重新安裝的,所以我應該怎麼做才能讓它改變。 2)同樣在getTweets中,在我發出ajax請求之前,我想在我的商店中設置推文給[],以防止來自前一頁的推文(比如在我登錄之前)從剩餘的頁面直到回覆正確的推文回覆。完成此操作的最佳實踐是什麼?

所有輸入,非常感謝:)

回答

1

1)現在我打電話時getTweets飼料的即將上馬,只是如果我改變中的其他組分的輸送不會改變我的會話狀態,我想因爲它不是重裝,所以我應該怎麼做才能讓它改變。

當您「更改會話狀態」時,您需要從另一個組件調用dispatch(fetchAllTweets(currUserId))。只要更新state.tweets,它將立即更新您的Feed組件。

2)另外在getTweets實際上,之前我做Ajax請求我想在我的店裏設置鳴叫[],以防止前一頁鳴叫(之前說我登錄)殘留在頁面上直到回覆正確的推文爲止。完成此操作的最佳實踐是什麼?

你可以改變你的mapDispatchToProps到:

const mapDispatchToProps = (dispatch) => ({ 
    getTweets: (currUserId) => { 
     dispatch(clearTweets()); 
     return dispatch(fetchAllTweets(currUserId)); 
    } 
}); 

創建行動的創建者:

const clearTweets =() => ({ type: 'CLEAR_TWEETS' }); 

而且在更新tweets狀態,你可以做這樣的事情的減速機:

switch (action.type) { 
    case 'CLEAR_TWEETS': 
     return []; 
    // other actions 
} 
相關問題