#reactjs #apollo-client
#реагирует на #аполлон-клиент
Вопрос:
Существует ли предпочтительный способ обновления результатов запроса с помощью подписки? Насколько я могу видеть, для этого есть два варианта: useSubscription хук с writeQuery методом и subscribeToMore вспомогательный метод.
Вариант № 1:
const Posts = ({user}) =gt; { const [addPost] = useMutation(addPostMutation); const { data } = useQuery(postsQuery); const posts = data ? data.posts : []; useSubscription(postAddedSubscription, { onSubscriptionData: ({client, subscriptionData}) =gt; { client.writeQuery({ query: postsQuery, data: { posts: [...posts, subscriptionData.data.postAdded] } }); } }); return ( lt;section className="section"gt; lt;div className="container"gt; lt;h1 className="title"gt;User: {user}lt;/h1gt; lt;PostList user={user} posts={posts}/gt; lt;PostInput onSend={addPost}/gt; lt;/divgt; lt;/sectiongt; ); }; Вариант № 2:
const Posts = ({user}) =gt; { const [addPost] = useMutation(addPostMutation); const { data, subscribeToMore } = useQuery(postsQuery); const posts = data ? data.posts : []; useEffect(() =gt; { let unsubscribe = subscribeToMore({ document: postAddedSubscription, updateQuery: (prev, { subscriptionData }) =gt; { if (!subscriptionData.data) return prev; const newPost = subscriptionData.data.postAdded; return { posts: [...prev.posts, newPost], }; }, }); return () =gt; unsubscribe(); }, []); return ( lt;section className="section"gt; lt;div className="container"gt; lt;h1 className="title"gt;User: {user}lt;/h1gt; lt;PostList user={user} posts={posts}/gt; lt;PostInput onSend={addPost}/gt; lt;/divgt; lt;/sectiongt; ); }; Есть ли какие-либо преимущества у любого из этих методов или их можно использовать в соответствии с предпочтениями?