插入阿波罗后更新缓存不起作用

Question

我正在使用带有连接插头的 graphql-compose-mongoose，它基本上返回一个游标驱动的分页结果。

因此，我的数据格式为：data.queryname.edges[]。我正在尝试将新创建的项目添加到边缘：这是代码：

function onCommentAdded(complaintActionCreate) {
    const newData = {...complaintActionConnection}
    newData.edges = newData.edges.slice()
    newData.edges.unshift({__typename: "ComplaintActionEdge", cursor:newData.count, node: complaintActionCreate.record})
    newData.count++
    logger.debug("new data : ", newData)
    client.writeQuery({
        query: COMPLAINT_ACTIONS,
        data: newData,
        variables: {
            issueId: issue._id,
            commentsOnly: true
        }
    })
    setRefresh(true) //force a state change
}

这将创建这种形式的结果，其中第一个元素是由上面的代码添加的：重点是表明我尊重与现有数据完全相同的结构。但是我的表没有更新，即使我在调用 client.writeQuery 后强制它重新渲染

{
  "__typename": "ComplaintActionConnection",
  "count": 21,
  "pageInfo": {
    "__typename": "PageInfo",
    "startCursor": "eyJfaWQiOiI2MGZhYjBiZDEyZjg1MjIxOGNiZjE2YjQifQ==",
    "endCursor": "eyJfaWQiOiI2MGZhYWViNjEyZjg1MjIxOGNiZjE1YmEifQ==",
    "hasNextPage": true,
    "hasPreviousPage": false
  },
  "edges": [
    {
      "__typename": "ComplaintActionEdge",
      "cursor": 20,
      "node": {
        "_id": "60fab1b312f852218cbf1738",
        "entity": {
          "complaintId": "60eeba1e1e6ee73bfc4b1350",
          "__typename": "ComplaintActionEntity"
        },
        "user": {
          "userId": "60d079d48cc3ab35c8401bae",
          "userName": "Zied Hamdi",
          "roleInShop": null,
          "__typename": "ComplaintContributorsUser"
        },
        "actionType": "COMMENT",
        "state": {
          "value": null,
          "text": "dlkfjsdm\n",
          "__typename": "ComplaintActionState"
        },
        "attachmentId": null,
        "createdAt": "2021-07-23T12:10:27.706Z",
        "updatedAt": "2021-07-23T12:10:27.706Z",
        "__typename": "ComplaintAction"
      }
    },
    {
      "__typename": "ComplaintActionEdge",
      "cursor": "eyJfaWQiOiI2MGZhYjBiZDEyZjg1MjIxOGNiZjE2YjQifQ==",
      "node": {
        "__typename": "ComplaintAction",
        "_id": "60fab0bd12f852218cbf16b4",
        "actionType": "COMMENT",
        "user": {
          "__typename": "ComplaintContributorsUser",
          "userId": "60d079d48cc3ab35c8401bae",
          "userName": "Zied Hamdi",
          "roleInShop": null
        },
        "entity": {
          "__typename": "ComplaintActionEntity",
          "complaintId": "60eeba1e1e6ee73bfc4b1350"
        },
        "state": {
          "__typename": "ComplaintActionState",
          "value": null,
          "text": "aa"
        },
        "attachmentId": null,
        "createdAt": "2021-07-23T12:06:21.434Z",
        "updatedAt": "2021-07-23T12:06:21.434Z"
      }
    },
    {
      "__typename": "ComplaintActionEdge",
      "cursor": "eyJfaWQiOiI2MGZhYWY1NDEyZjg1MjIxOGNiZjE2NmEifQ==",
      "node": {
        "__typename": "ComplaintAction",
        "_id": "60faaf5412f852218cbf166a",
        "actionType": "COMMENT",
        "user": {
          "__typename": "ComplaintContributorsUser",
          "userId": "60d079d48cc3ab35c8401bae",
          "userName": "Zied Hamdi",
          "roleInShop": null
        },
        "entity": {
          "__typename": "ComplaintActionEntity",
          "complaintId": "60eeba1e1e6ee73bfc4b1350"
        },
        "state": {
          "__typename": "ComplaintActionState",
          "value": null,
          "text": "000\n"
        },
        "attachmentId": null,
        "createdAt": "2021-07-23T12:00:20.331Z",
        "updatedAt": "2021-07-23T12:00:20.331Z"
      }
    }
  ]
}

仅供参考，我正在粘贴我的查询代码

const {loading, data, error, fetchMore } = useQuery(COMPLAINT_ACTIONS, {
    variables: {
        issueId: issue._id,
        commentsOnly: true
    },
    onCompleted: ()=>setRefresh(false)
})
if (loading) return null
if (error) return <DisplayState state={DEFAULT_STATES.ERROR} message={error.message} error={error}/>

if (!data) {
    return null
}

const {complaintActionConnection} = data

return (
    <Grid container className={classes.root}>
        <Grid item className={classes.header}>
            <Typography variant='h6'>{complaintActionConnection.count} {t('detail.comments.count')}</Typography>
            {/*<AddComplaintAction issueId={issue._id}/>*/}
        </Grid>
        <Grid item className={classes.item}>
            <AddComment issue={issue} onAdded={onCommentAdded}/>
        </Grid>
        <Grid item className={classes.item}>
            <List>
                {complaintActionConnection.edges.map(showComment
                )}
            </List>
        </Grid>
    </Grid>
)