将 Strapi 连接到 NextJS/Apollo 客户端 GraphQL -- 未提供所需类型 'XXX' 的变量“$input”
Connecting Strapi to NextJS/Apollo Client GraphQL -- Variable "$input" of required type 'XXX' was not provided
请原谅,这是非常基础的,但我已经有一年左右没有使用 GraphQL 了,我错过了显而易见的东西。我正在尝试使用 GraphQL 将 Strapi 后端连接到 NextJS/Apollo 客户端前端,但我无法理解基本语法。 (这是我们正在处理的项目的 'proof of concept',只是为了看看我们是否可以将 Strapi、NextJS 和富文本编辑器用于我们的用例)
Strapi 为我提供了 createPost
端点
据我所知,我需要发送一个包含我的文本的字段 data
的对象。我正在使用 TinyMCE 的编辑器来编辑文本并使用 apollo hooks 来获取突变
const TheEditor = () => {
const [addPost, {data}] = useMutation(ADD_POST);
const [theText, setText] = useState('')
const handleEditorChange = (content, editor) => {
console.log('Content was updated:', content);
setText(content)
}
return <>
<Editor apiKey='4564654765476547654'
initialValue="<p>This is the initial content of the editor</p>"
init={{
height: 500,
menubar: false,
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetimse media table paste code help wordcount'
],
toolbar:
'undo redo | formatselect | bold italic backcolor | \
alignleft aligncenter alignright alignjustify | \
bullist numlist outdent indent | removeformat | help'
}}
onEditorChange={handleEditorChange}
/>
<button onClick={async e => {
e.preventDefault();
await addPost({variables: {data:theText}});
}}>ENTER
</button>
</>
}
export default withApollo(TheEditor);
我的突变是
const ADD_POST = gql`
mutation ADD_POST($input: createPostInput!) {
createPost(input: $input) {
post {
text
}
}
}
`;
但是我得到了错误
很明显,问题是我需要回去重新学习 GraphQL 语法的基础知识。与此同时,我希望有人能指出我的方式中的(严重的)错误。我一直在关注 Apollo 教程 here,但我似乎无法从他们的代码跳转到我的代码。非常感谢任何帮助。
你输入的变量名不是数据
<button onClick={async e => {
e.preventDefault();
await addPost({variables: { input:theText }});
}}>ENTER
</button>
请原谅,这是非常基础的,但我已经有一年左右没有使用 GraphQL 了,我错过了显而易见的东西。我正在尝试使用 GraphQL 将 Strapi 后端连接到 NextJS/Apollo 客户端前端,但我无法理解基本语法。 (这是我们正在处理的项目的 'proof of concept',只是为了看看我们是否可以将 Strapi、NextJS 和富文本编辑器用于我们的用例)
Strapi 为我提供了 createPost
端点
据我所知,我需要发送一个包含我的文本的字段 data
的对象。我正在使用 TinyMCE 的编辑器来编辑文本并使用 apollo hooks 来获取突变
const TheEditor = () => {
const [addPost, {data}] = useMutation(ADD_POST);
const [theText, setText] = useState('')
const handleEditorChange = (content, editor) => {
console.log('Content was updated:', content);
setText(content)
}
return <>
<Editor apiKey='4564654765476547654'
initialValue="<p>This is the initial content of the editor</p>"
init={{
height: 500,
menubar: false,
plugins: [
'advlist autolink lists link image charmap print preview anchor',
'searchreplace visualblocks code fullscreen',
'insertdatetimse media table paste code help wordcount'
],
toolbar:
'undo redo | formatselect | bold italic backcolor | \
alignleft aligncenter alignright alignjustify | \
bullist numlist outdent indent | removeformat | help'
}}
onEditorChange={handleEditorChange}
/>
<button onClick={async e => {
e.preventDefault();
await addPost({variables: {data:theText}});
}}>ENTER
</button>
</>
}
export default withApollo(TheEditor);
我的突变是
const ADD_POST = gql`
mutation ADD_POST($input: createPostInput!) {
createPost(input: $input) {
post {
text
}
}
}
`;
但是我得到了错误
很明显,问题是我需要回去重新学习 GraphQL 语法的基础知识。与此同时,我希望有人能指出我的方式中的(严重的)错误。我一直在关注 Apollo 教程 here,但我似乎无法从他们的代码跳转到我的代码。非常感谢任何帮助。
你输入的变量名不是数据
<button onClick={async e => {
e.preventDefault();
await addPost({variables: { input:theText }});
}}>ENTER
</button>