2016-11-07 30 views
4

我有兩個屏幕:如何在包裝組件外重新提取查詢?

屏蔽1:結果

屏蔽2:編輯過濾器

當我在屏幕2,按回編輯的過濾器,我想重新獲取對屏蔽1查詢(用新內置過濾器字符串變量)。編輯過濾器不會使用突變或觸發任何Redux操作(我將用戶搜索過濾器/首選項存儲在localStorage/AsyncStorage而不是數據庫中,因此不存在突變)。我只是改變窗體的本地狀態,並使用它來構建一個篩選字符串,我想傳遞給Screen1上的某個查詢。如果有幫助,我可以訪問兩個屏幕上的過濾器字符串。

看起來好像refetch()僅限於組件的查詢包裝http://dev.apollodata.com/react/receiving-updates.html#Refetch所以如何重新從不同的屏幕查詢?

我試着在Screen1和Screen2上放置相同的查詢,然後在Screen2上調用重新獲取,儘管查詢工作並獲得了Screen2上的新數據,但同樣的名稱查詢並沒有在Screen1上更新,它。如果他們有相同的名字,它不應該嗎? (但過濾器變量改變)

enter image description here

如果我只是在設計這個錯誤並且還有一個更簡單的方法來做到這一點,請讓我知道。我期望如果我有兩個屏幕,將相同的查詢放在它們兩個上,並用新的過濾器變量重新獲取其中一個查詢,那麼重新讀取應該發生在兩個地方,但目前它們正在單獨處理它們。

+0

當您更改屏幕2頁上的流派,是價值的存在UPD在屏幕1上可用的方式將其作爲屏幕1查詢的變量傳遞給客戶端?我可能是完全錯誤的,但我的猜測是屏幕1的查詢變量沒有被屏幕2上的過濾器選擇所改變。如果不清楚我的建議是什麼,那麼今晚我可以花一些時間編碼出一個簡單的運行示例來展示我將如何執行此操作。 – Brandon

回答

1

我在這裏做了同樣的事情。場景: - 我選擇一個對等體來過濾一些消息。 - 我將peerId保持爲REDX - 我使這兩個組件(篩選器和列表)都依賴於該REDX值。

像這樣:

1 - 把那個過濾器值的終極版(和搶回來):

import { compose, graphql } from 'react-apollo' 
import { connect } from 'react-redux'; 
... 
export default compose(
    connect(
     (state,ownProps) => ({ 
      selectedMessages: state.messages.selectedMessages, 
      peerId: state.messages.peerId 
     }), 
     (dispatch) => ({ 
      clearSelection:() => dispatch(clearSelection()), 
      setPeer: (peerId) => dispatch(setPeer(peerId)) 
     }) 
    ), 
    graphql(
     PEERS_QUERY, 
... 

當你調用連接第一個(使用撰寫),你叫graphql前包裝,或包裝外面,你會對你的graphql包裝可以作爲道具的peerID,所以你可以用它來過濾查詢:

export default compose(
    connect(
     (state,ownProps) => { 
      return { 
       peerId: state.messages.peerId, 
       selectedMessages: state.messages.selectedMessages 
      } 
     }, 
     (dispatch) => ({ 
      toggleMessage(messageId) { 
       dispatch(toggleMessage(messageId)); 
      } 
     }) 
    ), 
    graphql(// peerId is available here because this is wrapped by connect 
     MESSAGES_QUERY, 
     { 
      options: ({peerId}) => ({variables:{peerId:peerId}}), 
      skip: (ownProps) => ownProps.peerId === '', 
      props: ({ 
      ... 
     ... 
    ... 
)(MessageList);