小编Str*_*ler的帖子

• 要使用 Apollo 实现分页，您通常会结合使用fetchMore发送查询时提供的函数updateQuery告诉 Apollo 如何使用结果更新其缓存（将其附加到您已有的内容上）。
• 要实现近乎实时的同步，您通常会使用轮询，它将每 x 秒重新发送一次初始查询。

因此，轮询会重新获取您的初始查询并覆盖缓存，因此您将丢失分页以及fetchMore通过updateQuery.

我的问题：如何在保持良好用户体验的同时进行轮询和分页？（无订阅）

Please run the example below. I'm trying to stretch the left line further to the left to compensate the parent's padding as you can see in the second example, while keeping the title centered relative to the parent like in the first example. I can't seem to have both.

(For anyone who's familiar, the divider I'm trying to tweak comes from ant-design)

#container {
  height: 100px;
  width: 400px;
  background: #EFEFEF;
  padding: 24px;
}

/* Normal use case */

.divider { …

我有这样的事情：

.row {
  width: 300px;
  border: 1px solid black;
  display: flex;
}

.otherstuff {
  flex-grow: 1;
}

.grid {
  display: grid;
  grid-auto-flow: column;
  gap: 10px 10px;
}

.cell {
  border: 1px solid blue;
}

<div class='row'>
  <div class='stuff'>Stuff</div>
  <div class='otherstuff'>
    <div class='grid'>
      <div class='cell'>Cell 1</div>
      <div class='cell'>Cell 2</div>
    </div>
  </div>
</div>

我希望网格仅占用所需的最小空间，而不要扩展。我已经阅读了该线程，并看到使用grid-template-columns和auto值是可行的，但是有一种方法可以在不事先知道子代数的情况下进行吗？

谢谢。

假设我有这样的事情，其中两个组件A，并D听取在全球存储器的变化：

import React from 'react'
import useStore from 'whatever-global-store-manager'

function A() {
  const [store] = useStore()
  if(!store.currentUser)
    return <h1>You must log in</h1>
  else return <B/>
}

function B() {
  return <C/>
}

function C() {
  return <D/>
}

function D() {
  const [store] = useStore()
  console.log(store.currentUser) // Can it be falsey ?
  return <h1>{store.currentUser.name}</h1>
}

在中A，当currentUser为false时，B不呈现，因此D不呈现。但是假设这种情况：

• 首先，currentUser被定义为具有name属性的对象，因此进行D渲染，侦听商店中的更改并渲染name。
• 然后，将应用程序中的其他currentUser位置设置为 …

Since I reinstalled my NPM dependencies in my create-react-app project, Atom's eslint gives me this error on the top of every file :

Error while running ESLint: Cannot find module 'eslint-config-react-app'.

While react-scripts's eslint doesn't raise any warning or error. By the way, the package eslint-config-react-app is installed in node_modules. I tried to reinstall linter-eslint, atom, the NPM dependencies, etc. Nothing worked.

Has anyone an idea ?

Here is my .eslintrc :

{
  "extends": "react-app",
  "rules": {
    "jsx-a11y/anchor-is-valid": …

大约一年前，对apollo-server（或react-apollo？）进行了更新，这完全打破了 GraphQL 请求中省略可空输入的旧用法。

在更新之前，您可以定义如下内容：

Mutation {
  editProfile(id: ID!, name: String, avatar: String)
}

当调用省略输入的客户端时，请说：

editProfile(id: "whateverid", name: "James")

你在你的解析器中得到avatar了undefined。 现在已设置为null.

问题是：null例如，对于某些可选输入来说 是一个完全有效的值avatar。所以基本上，我们在这个过程中丢失了信息，并且不再能够区分服务器端之间的区别：

• 被省略并出现的可选输入null（=不更新数据库），以及
• 显式设置为null（= 更新数据库）的可选输入

我在 Github 上打开了一个关于它的线程：https ://github.com/apollographql/apollo-server/issues/2056

一年前，另一个人在react-apolloGithub 上做了同样的事情： https: //github.com/apollographql/react-apollo/issues/1569

dacz 发布了一个有趣的回复，总结得很好：

当可空输入未出现在 apollo 客户端的查询变量中时，将使用空值进行调用。客户端不应将整个输入作为 null 传递，而应完全省略它或以 undefined 传递它。传递 null 可能意味着显式将输入设为 null。同样适用于输入字段，因此服务器可能会对显式重置值做出反应（在输入中显示为 null，或者如果省略则不处理它）。

这两个线索仍然悬而未决。

有人对此有任何干净的解决方案吗？

如何有效地将一组间隔（输入集）拆分为最小的不相交间隔集（输出集），以便输入集中的所有间隔都可以表示为输出集中间隔的并集？

例子 ：

Input: [0,9] [2,12]\nOutput: [0,1] [2,9] [10,12]\n\nTest :\n[0,9] = [0,1] \xe2\x88\xaa [2,9]\n[2,12] = [2,9] \xe2\x88\xaa [10,12]\n\nInput: [0,Infinity] [1,5] [4,6]\nOutput: [0,0] [1,3] [4,5] [6,6] [7,Infinity]\n\nTest :\n[0,Infinity] = [0,0] \xe2\x88\xaa [1,3] \xe2\x88\xaa [4,5] \xe2\x88\xaa [6,6] \xe2\x88\xaa [7,Infinity]\n[1,5] = [1,3] \xe2\x88\xaa [4,5]\n[4,6] = [4,5] \xe2\x88\xaa [6,6]\n

我需要在 Javascript 中执行此操作。这是我尝试过的想法：

// The input is an array of intervals, like [[0,9], [2,12]], same for the output\n\n// This function converts a set of overlapping\n// intervals into …

有没有办法检查类型参数是否T实际上是unknown类型？

我知道可以检查any（此处的解决方案），但想知道unknown。