要解决ApolloClient的updateQuery不重新渲染组件的问题,可以尝试使用refetchQueries或者writeQuery来更新组件。
import { useMutation } from '@apollo/react-hooks';
const [updateData] = useMutation(UPDATE_MUTATION, {
refetchQueries: [{ query: GET_DATA_QUERY }],
});
// 当需要更新数据时调用
updateData();
import { useMutation } from '@apollo/react-hooks';
const [updateData] = useMutation(UPDATE_MUTATION);
// 当需要更新数据时调用
updateData({
variables: { /* 更新的变量 */ },
update: (cache, { data }) => {
cache.writeQuery({
query: GET_DATA_QUERY,
data: { /* 更新的数据 */ },
});
},
});
在这两种方法中,都需要先定义一个GraphQL mutation,然后通过useMutation钩子来使用它。在调用mutation时,可以使用refetchQueries来重新获取数据并触发组件的重新渲染,或者使用writeQuery手动更新Apollo Client的缓存数据,从而重新渲染组件。