Реагируйте на загрузку данных Apollo из кеша, а затем сделайте запрос - PullRequest
Новая
       50

Реагируйте на загрузку данных Apollo из кеша, а затем сделайте запрос

1 голос
/ 17 мая 2019

Здравствуйте, у меня проблема с React-Apollo ..

Когда я устанавливаю fetchPolicy в кеш-сеть, мой Apollo каждый раз делает новый запрос и не загружает данные из кеша.

Я хочу, чтобы Apollo сначала загрузил данные из кэша, а затем сделал запрос, а затем обновил данные и перезагрузил Компонент, если результат отличается от данных кэша. 

const client = new ApolloClient({
    connectToDevTools: true,
    cache,
    link: ApolloLink.from([
        stateLink,
        new HttpLink({
            uri: "..."
        })
    ]),
});

query user($userId: String) {
    user(_id: $userId) {
        __typename
        _id
        fullname
        username
        followed_by_viewer
        follows_viewer
        edge_followed_by {
            count
        }
        edge_follow {
            count
        }
    }
}

<Query query={GET_USER} variables={{ userId }} fetchPolicy={"cache-and-network"} partialRefetch={false} >
{({ data, loading, error, refetch }) => {

        if (error) return <Text>Error</Text>
        if (loading) return <Text>Loading</Text>

        let user = data.user;

        console.log(user);

        return (
            <ScrollView
                refreshControl={
                    <RefreshControl
                        refreshing={loading}
                        onRefresh={refetch}
                    />
                }>

                <View style={[s.gradientBar, { backgroundColor: profileColor }]} />

                <View style={s.nameInfos}>
                    <Text style={s.fullname}>{user.fullname}</Text>
                    <Text style={s.name}>@{user.username}</Text>
                </View>



            </ScrollView>
        )
    }}

</Query>

1 Ответ

0 голосов
/ 17 мая 2019

С _id и __typname определенный объект должен быть должным образом кэширован в нормализованной форме. Вы можете проверить детали кэша / состояние / внутренние данные (хранилище данных) с помощью инструментов реагирования (чтобы быть уверенным на 100%).

Я хочу, чтобы Apollo сначала загрузил данные из кэша, а затем сделал запрос, а затем обновил данные и перезагрузил Компонент, если результат отличается от данных кэша.

Сначала используется кэш - политика по умолчанию.

Использование refetch (в качестве обновления) IMHO вызывает сетевой запрос - это часть существующего <Query/> состояния / процесса, а не отдельное действие. Будет использоваться кеш (только) (без сетевого запроса), т. Е. когда другой экземпляр или другой компонент запрашивает тот же диапазон данных (запрос, переменные).

<Query/> компонент создает наблюдаемую, автоматически обновляется при обновлении данных кэша (например, после мутации из другого компонента).

...