1

我想知道是否可以在用 gatsby 制作的网站中编写突变查询。我想在 Strapi 中创建的数据不会用于显示新信息，它只会存储数据。

有什么方法可以做到这一点吗？根据我的阅读，盖茨比本身不会改变 Strapi 数据。

4

1 回答 1

2

您需要为您的网站提供 ApolloClient。最好的方法是在你的根目录下 gatsby-ssr.js 和 gatsby-browser.js 之后你可以react-apollo像下面的例子一样使用

客户端.js

import ApolloClient from "apollo-boost"

const token = "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJfaWQiOiI1ZDRhN2FlNjRlYzE1MzIxMTY0N2EzNWMiLCJpc0FkbWluIjp0cnVlLCJpYXQiOjE1NjU1OTI2ODcsImV4cCI6MTU2ODE4NDY4N30.FZIWJ7sWhmQo6MPgUbY2Js-uVMWY1kUdASvr2oyY6Sd"
const url = "http://localhost:1337"

export default new ApolloClient({
  uri: `${url}/graphql`,
  request: operation => {
    operation.setContext({
      headers: {
        Authorization: `Bearer ${token}`,
      },
    })
  },
})

gatsby-ssr.js 和 gatsby-browser.js


import React from 'react';
import { ApolloProvider } from 'react-apollo';
import { client } from './src/client';

export const wrapRootElement = ({ element }) => (
  <ApolloProvider client={client}>
    {element}
  </ApolloProvider>
);

postTemplate.js

import React from "react"
import { Mutation } from "react-apollo"
import gql from "graphql-tag"

const POST_MUTATION = gql`
  mutation PostMutation($description: String!, $url: String!) {
    post(description: $description, url: $url) {
      id
      createdAt
      url
      description
    }
  }
`
const PostTemplate = () => {
  const description = "example description"
  const url = "url"

  return (
    <Mutation mutation={POST_MUTATION} variables={{ description, url }}>
      {() => <button onClick={"... you'll implement this "}>Submit</button>}
    </Mutation>
  )
}

Export default PostTemplate

其他链接

于 2019-08-12T08:29:04.507 回答