diff --git a/docs/api/apollo-query.md b/docs/api/apollo-query.md index 176e1a0..b1fa7eb 100644 --- a/docs/api/apollo-query.md +++ b/docs/api/apollo-query.md @@ -47,7 +47,7 @@ To enable support of `gql` string tag in Vue templates, see the necessary setup - `debounce`: Number of milliseconds for debouncing refetches (for example when the variables are changed) - `throttle`: Number of milliseconds for throttling refetches (for example when the variables are changed) - `prefetch`: If `false`, will skip prefetching during SSR -- `options`: Other Apollo Watch Query options. +- `options`: Other Apollo Watch Query options ## Scoped slot diff --git a/docs/guide/apollo/queries.md b/docs/guide/apollo/queries.md index 1e4c298..8761611 100644 --- a/docs/guide/apollo/queries.md +++ b/docs/guide/apollo/queries.md @@ -77,14 +77,14 @@ You can then use your property as usual in your vue component: ``` -## Name macthing +## Name matching Please note that a common beginner's error is to use a different data name from the field name in query, eg: ```js apollo: { world: gql`query { - hello + hello }` } ``` @@ -107,7 +107,7 @@ You can also rename the field in the GraphQL document directly: ```js apollo: { world: gql`query { - world: hello + world: hello }` } ``` diff --git a/docs/zh-cn/README.md b/docs/zh-cn/README.md index 2762352..2628860 100644 --- a/docs/zh-cn/README.md +++ b/docs/zh-cn/README.md @@ -54,5 +54,5 @@ footer: LICENCE MIT - Created by Guillaume CHAU (@Akryum)

::: tip 当前版本 -中文文档现在同步至 v3.0.0-beta.30 +中文文档现在同步至 v3.0.0-rc.2 ::: diff --git a/docs/zh-cn/api/apollo-query.md b/docs/zh-cn/api/apollo-query.md index b8929fd..e81315b 100644 --- a/docs/zh-cn/api/apollo-query.md +++ b/docs/zh-cn/api/apollo-query.md @@ -47,6 +47,7 @@ - `debounce`:对重新获取查询结果的防抖毫秒数(例如当变量更改时) - `throttle`:对重新获取查询结果的节流毫秒数(例如当变量更改时) - `prefetch`:如为 `false`,将跳过 SSR 期间的预取 +- `options`:其他可用的 Apollo 监听查询选项 ## 作用域插槽 diff --git a/docs/zh-cn/api/smart-subscription.md b/docs/zh-cn/api/smart-subscription.md index 1c82045..390186e 100644 --- a/docs/zh-cn/api/smart-subscription.md +++ b/docs/zh-cn/api/smart-subscription.md @@ -9,6 +9,7 @@ - `throttle`:变量更新节流时间(毫秒)。 - `debounce`:变量更新防抖时间(毫秒)。 - `result(data, key)` 是收到结果时调用的钩子。 +- `error(error)` 是有错误时调用的钩子。`error` 是一个具有 `graphQLErrors` 属性或 `networkError` 属性的 Apollo 错误对象。 ## 属性 diff --git a/docs/zh-cn/api/ssr.md b/docs/zh-cn/api/ssr.md index 1661b92..39502a8 100644 --- a/docs/zh-cn/api/ssr.md +++ b/docs/zh-cn/api/ssr.md @@ -41,5 +41,8 @@ const js = ApolloSSR.exportStates(apolloProvider, options) attachTo: 'window', // 每个 apollo 客户端状态的 key 的前缀 exportNamespace: '', + // 我们默认使用 sanitize js 库来阻止 XSS + // 在这里传入 true 将对状态执行标准的 JSON.stringify + useUnsafeSerializer: false, } ``` diff --git a/docs/zh-cn/guide/apollo/queries.md b/docs/zh-cn/guide/apollo/queries.md index b5d8156..35901e8 100644 --- a/docs/zh-cn/guide/apollo/queries.md +++ b/docs/zh-cn/guide/apollo/queries.md @@ -77,6 +77,43 @@ export const resolvers = { ``` +## 名称匹配 + +请注意,初学者常见的错误是使用与查询中的字段名不相同的数据名称,例如: + +```js +apollo: { + world: gql`query { + hello + }` +} +``` + +注意 `world` 与 `hello` 的不同之处:vue-apollo 不会去猜测你想要将哪些数据从查询结果中放入组件中。默认情况下,它只会尝试你在组件中使用的数据名称(即 `apollo` 对象中的键),在本例中为 `world`。如果名称不匹配,你可以使用 `update` 选项来告诉 vue-apollo 在结果中使用什么样的数据: + +```js +apollo: { + world: { + query: gql`query { + hello + }`, + update: data => data.hello + } +} +``` + +你也可以直接在 GraphQL 文档中重命名该字段: + +```js +apollo: { + world: gql`query { + world: hello + }` +} +``` + +在本例中,我们将 `hello` 字段重命名为 `world`,以便 vue-apollo 来自动推断应该从结果中取回什么。 + ## 带参数的查询 你可以通过在对象中声明 `query` 和 `variables` 将变量(读取参数)添加到 `gql` 查询中: