当前位置: 首页 > 知识库问答 >
问题:

React-Apollo客户端-构造组件

郁隐水
2023-03-14

假设Component-TODOList需要以两种不同的方式显示TODO的列表,listview和gridview。假设我想保持两个视图作为不同的组件,那么最佳实践是什么-

>

  • 使用graphql查询创建TodoList组件,然后将查询结果传递给TODOListView和TODOGridView组件?

    创建没有graphql查询的TodoList组件,然后在ToDoListView和TODOGridView组件中写入相同的grqphql查询(不干,每个组件中都有查询重复,但apollo cache会确保它不会被多次调用)?

    每种方法的好坏?

  • 共有1个答案

    邵畅
    2023-03-14

    如果没有真正的选择,缓存的使用没有价值作为参数,那么没有好的部分与第二种方法。

    考虑到可用性、UX、以用户为中心的设计,您可能希望在切换视图类型时保持页面、排序和过滤状态。作为一个用户,您期待这种行为。这只有在第一个解决方案中才容易获得。

    假设我希望将两个视图作为不同的组件

    这也是错误的假设。当然,您可以这样做,但是列表几乎是相同的,真正的区别在于项目/行的呈现。如果这是一个简单的样式集更改(或添加几个元素),那么甚至不需要为项目使用组件,只需要条件呈现。您可以稍后更改/重构它。

    利用item组件,您可以获得额外的抽象层和更复杂的用例。通过向下传递(输入项)切换类型处理程序,我可以从simgle项级别更改类型,或者更改本地项视图类型-混合元素列表(Type-Mixed element List)。

     类似资料:
    • 我有以下代码,我正在尝试决定如何处理错误: 服务器发回一个GraphQL错误对象,并将其发回,使其出现在突变的块中。如果变异成功,组件的数据将使用参数更新,但我看不到处理错误的等价方法。 理想情况下,我希望更新块中的Apollo缓存,但在这一点上,我甚至不能向组件或状态注入道具。 最终的结果是在Register组件上设置一个prop/state,它显示了一个带有条件呈现的错误消息组件。一种方法可以

    • 在后端,我进行了调试,并收到了请求,它根据客户机上设置的令牌查找用户,但随后什么也不做,只在我试图从应用程序发送时返回给我400,在graphiql浏览器上。 我错过了什么?非常感谢。

    • 反应阿波罗客户端应用程序。我试图使用readQuery从缓存中读取数据,但无法读取缓存字段。 这里有一个纲要: 组件调用,它执行我的查询并缓存结果。查询返回类型。一切都很好,开发工具显示包含一个名为getPost的字段和该帖子。 有一个子组件,它会在单击时删除评论。它调用并删除评论。查询返回类型。 Post有一个注释数组,现在我需要在缓存中更新它的数组并删除已删除的注释。我使用突变中的函数来获取缓

    • 我有一个小程序,其方法从浏览器中的JavaScript函数调用。该方法最终将文件发送到AmazonS3 bucket。但是,当该方法尝试创建AmazonS3Client时,该方法失败,不会显示任何错误。 该方法中代码的相关代码片段是: try/catch块中的任何消息都不会打印。方法的其余代码(为简洁起见,此处未显示)也不会被触发。 jar文件编译无误。我用的是jdk 1.7.0_51和amazo

    • 我的用途是case是一个map组件。我只希望当用户按下按钮时加载标记的数据,但不是在初始组件安装或位置改变时。 下面的代码示例:

    • 我在服务器上使用GraphQL和mongoose。 当发生验证错误时,GraphQL突变发送状态代码为200的响应。在客户端,响应如下所示: 我想使用阿波罗客户端突变promise的功能访问验证错误。类似: 如何做到这一点?