GraphQL(WP)通过uri获取自定义帖子



我正在学习youtube上的一个教程,该教程介绍如何使用GraphQL在无头wordpress api上执行基本查询。该教程(现在已经一年多了(所做的查询是:

query getBookBySlug($slug: String) {
book: bookBy(uri: $slug) {
title
book_meta{
price
publisher
}
}
}

Books/book是一个自定义的pust类型,我可以使用wordpress中的GraphiQL游乐场来查询它,看看它返回了什么上面查询的问题是ir返回null。此外,bookBy(或postBy(显然不受欢迎(根据我在GraphiQL中得到的警告,建议在我的情况下改为post(id:"(或book(id:"(。问题是,我想按"uri"而不是"id"查询这本书,而且似乎没有查询选项:

book(uri: "")

唯一的选择似乎是:

book(id: "")

uri字段已存在并已填充。GraphiQL中的这个查询成功地返回了所有必需的书籍详细信息:

query getBook {
book(id: "cG9zdDo0MA==") {
title
slug
uri
book_meta {
price
}
}
}

如何更改第一个函数以按uri查询图书?

查询getBookBySlug在代码的某个地方声明了参数(必须有参数才能构建完整的模式(。您需要更改这些参数以接受uri而不是id

此外,接收这些参数并返回书籍的函数必须能够处理uri参数并在DB中找到正确的书籍。

我在nuxtjs 中使用了slug

async asyncData({ params }) {
const data = {
query: `query GET_POST($slug: String) {
postBy(slug: $slug) {
title
content
author {
node {
name
}
}
featuredImage {
node {
caption
altText
sourceUrl(size: LARGE)
}
}
date
}
}`,
variables: {
slug: params.slug
}
}
const options = {
method: 'POST',
headers: { 'content-type': 'application/json' },
data: data,
url: 'http://localhost/graphql'
};

try {
const response = await axios(options);

return {
loadedPost: response.data.data.postBy
} 
} catch (error) {
console.error(error);
} 
},

以下是对我有效的方法:https://github.com/atazmin/nuxtjs-wordpress/blob/master/nuxt/pages/posts/_slug/index.vue

最新更新