如何使用 Relay 发送临时查询？

Question

我是 Relay 的新手，仍在努力了解它。根据我的理解，Relay 将查询与组件联系起来。这样，您可以说需要从 GraphQL 服务器提供组件 x、y 和 z。根据我的理解，官方 react-relay 库将在适当的时间发送这些查询，可能是在组件即将呈现时。

这对我来说对于简单的用例来说都很有意义，例如简单地显示数据列表。

不过，我对如何操作感到困惑的是如何分派可能不完全属于与组件相关联的事物类别的查询。一种查询，例如尝试获取用户身份验证会话令牌或其他内容的查询。这是我目前的情况：我正在尝试创建一个从 GraphQL 获取会话令牌的用户登录表单。我有一个参数化的 GraphQL 字段，它需要用户名和密码参数，如果它们有效，将 return 一个会话令牌。我只是不知道如何使用 Relay 来查询该会话令牌。

我基本上只需要分派查询并处理响应（将会话令牌放入 React 应用程序状态）。

有什么想法吗？

Answer 1

Relay 的 APIs 主要侧重于简化获取组件数据的过程，但 Relay 也支持临时查询。 API 相对较低级别，具有用于获取和读取数据的不同功能。以下是如何获取临时查询和访问响应的示例：

// Create a query with values for any variables:
var query = Relay.createQuery(Relay.QL`query ... `, {var: 'value'});
// Fetch any fields that have not yet been cached:
Relay.Store.primeCache({query}, readyState => {
  if (readyState.done) {
    // When all data is ready, read the data from the cache:
    var data = Relay.Store.readQuery(query)[0];
    /* access fields on `data` */
  }
});

如果数据不需要与 Relay 的缓存同步，您还可以使用普通网络请求（XHR、fetch 等）向您的 GraphQL 端点发送普通字符串查询。

Answer 2

老实说，使用单独的库可能是最简单的。我在我的 node 项目中使用 Lokka，它 dead-simple 并且可靠。

// config
const Lokka = require('lokka').Lokka;
const Transport = require('lokka-transport-http').Transport;

const client = new Lokka({
  transport: new Transport('http://graphql-swapi.parseapp.com/')
});



// query
client.query(`
  {
    allFilms {
      films {
        ...${filmInfo}
      }
    }
  }
`).then(result => {
  console.log(result.allFilms.films);
});

如何使用 Relay 发送临时查询？

How to dispatch an ad-hoc query, with Relay?

relayjs