使用Apollo的writeFragment更新嵌套列表

Question

我正在开发一个应用程序，可以使用舵和其他东西来配置船舶。数据库结构有点嵌套，到目前为止，我一直将 GraphQL 查询与数据库保持一致。

这意味着：我可以使用一些查询 Ship(projectId, ShipId) 来获取一艘船，但我使用的是嵌套查询：

query {
    project(id:1) {
        id
        title
        ship(id:1) {
            id
            name
            rudders {
                id
                position
            }
        }
    }
}

这样的结构当然会导致大量的嵌套数组。例如，如果我刚刚添加了一个新的舵，我将必须使用cache.readQuery 进行检索，这会为我提供项目对象而不是舵列表。要将舵添加到缓存中，我会得到一长串嵌套的、解构的对象，使代码难以阅读。

所以我想到了使用 GraphQL 片段。在互联网上，我看到它们被大量使用，以防止必须在大量对象上重新输入多个字段（我个人认为这也非常有用！）。然而，将片段用于数组的例子并不多。

当将一些数据附加到嵌套在某些缓存查询中的数组时，数组的片段可以保存所有对象解构。使用 Apollo 的 readFragment 和 writeFragment，我成功地完成了一些工作。

片段：

export const FRAGMENT_RUDDER_ARRAY = gql`
    fragment rudderArray on ShipObject {
        rudders {
            id
            position
        }
    }
`

用于主船查询：

query {
    project(id: ...) {
        id
        title
        ship(id: ...) {
            id
            name
            ...rudderArray
        }
    }
}
${RUDDER_FRAGMENT_ARRAY}

使用这个，我可以编写一个更清晰的 update() 函数来在突变后更新 Apollo 的缓存。见下图：

const [ createRudder ] = useMutation(CREATE_RUDDER_MUTATION, {
    onError: (error) => { console.log(JSON.stringify(error))},
    update(cache, {data: {createRudder}}) {
        const {rudders} = cache.readFragment({
            id: `ShipObject:${shipId}`,
            fragment: FRAGMENT_RUDDER_ARRAY,
            fragmentName: 'rudderArray'
        });

        cache.writeFragment({
            id: `ShipObject:${shipId}`,
            fragment: FRAGMENT_RUDDER_ARRAY,
            fragmentName: 'rudderArray',
            data: {rudders: rudders.concat(createRudder.rudder)}
        });
    }
});

现在我的问题是什么？好吧，因为我几乎从未见过片段用于此目的，所以我发现这工作得很好，但我想知道这是否有任何缺点。

另一方面，我也决定分享这个，因为我找不到任何例子。因此，如果这是一个好主意，请随意使用该模式！

Answer 1

使用 Apollo 的

writeFragment

来更新嵌套列表是一种有效的方法，特别是在处理复杂的嵌套结构时。以下是一些注意事项：

1. 可维护性：使用片段可以通过减少代码重复来提高可维护性。但是，如果数据结构发生变化，您将需要更新引用该结构的所有片段。这可以通过组织良好的代码库和一致的命名约定来管理。

2. 性能：片段允许您仅获取必要的字段，从而帮助优化性能。但是，请小心过度获取数据，这可能会导致不必要的重新渲染。

3. 可读性：片段通过封装相关字段来提高可读性。这使得更容易理解数据结构和所使用的字段。

4. 最佳实践：确保您的片段定义良好且可重用。避免深度嵌套的片段，因为它们会变得难以管理。

总的来说，将

writeFragment

与数组一起使用是一种很好的做法，但请注意片段的结构和组织，以确保它们保持可管理性。

如有更多疑问，请随时询问！