Apollo GraphQL (React) refetchQueries/update 突变后不更新商店
Apollo GraphQL (React) refetchQueries/update after mutation don't update the store
我有一个组件,当您想移动 file/folder 时,其行为与 Google 驱动器中的组件类似。它获取有关目录的所有必要数据,显示它,并在选择一个之后 - 将文件移动到另一个文件夹中。我试图达到的目标是更新有关当前显示的文件夹和文件已移动的文件夹的数据。我尝试了两种方式(refetchQueries,更新),但没有奏效...
主要问题是执行了 updateQueries 中定义的查询,但存储没有更新。
如果有人能帮忙就太好了!
const EntityMoveContainer = compose(
graphql(GET_DIRECTORIES, {
options() {/*...*/},
props(props) {/*...*/}
}),
graphql(MOVE_FILE, {
props(props) {
const { mutate, ownProps } = props;
const { entity, directoryId } = ownProps;
return {
async moveFile(destDirId) {
return mutate({
variables: {
fileId: entity.id,
directoryId: destDirId,
},
refetchQueries: () => [
{
query: GET_DIRECTORIES,
variables: {
id: directoryId,
sortKey: store.sortKey,
cursor: store.cursor,
filetype: store.filetype,
},
},
{
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
cursor: store.cursor,
filetype: store.filetype,
},
},
],
/* update(proxy) {
console.log('update method');
try {
const storeData = proxy.readQuery({
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
filetype: store.filetype,
cursor: store.cursor,
},
});
storeData.directory = {
...storeData.directory,
files: {
...storeData.directory.files,
edges: [
...storeData.directory.files.edges,
{ node: entity, __typename: 'File' },
],
},
};
proxy.writeQuery({
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
filetype: store.filetype,
cursor: store.cursor,
},
data: storeData,
});
} catch (e) {
console.log(e);
}
}, */
});
},
};
},
}),
)(EntityMoveView)
问题出在
cursor : ''
属性 我传入了 refetchQueries。
我有一个组件,当您想移动 file/folder 时,其行为与 Google 驱动器中的组件类似。它获取有关目录的所有必要数据,显示它,并在选择一个之后 - 将文件移动到另一个文件夹中。我试图达到的目标是更新有关当前显示的文件夹和文件已移动的文件夹的数据。我尝试了两种方式(refetchQueries,更新),但没有奏效...
主要问题是执行了 updateQueries 中定义的查询,但存储没有更新。
如果有人能帮忙就太好了!
const EntityMoveContainer = compose(
graphql(GET_DIRECTORIES, {
options() {/*...*/},
props(props) {/*...*/}
}),
graphql(MOVE_FILE, {
props(props) {
const { mutate, ownProps } = props;
const { entity, directoryId } = ownProps;
return {
async moveFile(destDirId) {
return mutate({
variables: {
fileId: entity.id,
directoryId: destDirId,
},
refetchQueries: () => [
{
query: GET_DIRECTORIES,
variables: {
id: directoryId,
sortKey: store.sortKey,
cursor: store.cursor,
filetype: store.filetype,
},
},
{
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
cursor: store.cursor,
filetype: store.filetype,
},
},
],
/* update(proxy) {
console.log('update method');
try {
const storeData = proxy.readQuery({
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
filetype: store.filetype,
cursor: store.cursor,
},
});
storeData.directory = {
...storeData.directory,
files: {
...storeData.directory.files,
edges: [
...storeData.directory.files.edges,
{ node: entity, __typename: 'File' },
],
},
};
proxy.writeQuery({
query: GET_DIRECTORIES,
variables: {
id: destDirId,
sortKey: store.sortKey,
filetype: store.filetype,
cursor: store.cursor,
},
data: storeData,
});
} catch (e) {
console.log(e);
}
}, */
});
},
};
},
}),
)(EntityMoveView)
问题出在
cursor : ''
属性 我传入了 refetchQueries。