2

So I have this nuxt-content project with several articles available in the /content/news folder.

I have a /pages/news/index.vue page with <ContentList /> inside, it works fine.

But I want to plug filter features on this page, eg. /news?author=myauthor or /news?tag=mytag.

So I went for <ContentList :query="query"> as per the docs.

If I set as a query:

import type { QueryBuilderParams } from "@nuxt/content/dist/runtime/types";
const query: QueryBuilderParams = {
  path: "/news",
  limit: 5,
  sort: [{ date: -1 }],
};

I get this API call which returns (along with other results):

[
  {
    "_path": "/news/2023-02-17-welcome-to-our-new-website",
    "_dir": "news",
    "_draft": false,
    "_partial": false,
    "_locale": "",
    "_empty": false,
    "title": "Welcome to our new website",
    "description": "I am delighted to introduce my new website with news releases publishing feature.",
    "cover": "https://images.unsplash.com/photo-1461749280684-dccba630e2f6?ixlib=rb-4.0.3&q=80&fm=jpg&crop=entropy&cs=tinysrgb",
    "createdAt": "2023-02-20T13:26:00.000Z",
    "draft": false,
    "publishedAt": "2023-02-17T00:00:00.000Z",
    "author": "My name",
    "auth": "aslugifiedname",
    "tags": [
      {
        "name": "news",
        "color": "green"
      }
    ],
    "body": {
      "type": "root",
      "children": [
        {
          "type": "element",
          "tag": "p",
          "props": {},
          "children": [
            {
              "type": "text",
              "value": "I am delighted to introduce my new website with news releases publishing feature."
            }
          ]
        }
      ],
      "toc": {
        "title": "",
        "searchDepth": 2,
        "depth": 2,
        "links": []
      }
    },
    "_type": "markdown",
    "_id": "content:news:2023-02-17-welcome-to-our-new-website.md",
    "_source": "content",
    "_file": "news/2023-02-17-welcome-to-our-new-website.md",
    "_extension": "md"
  },
]

(notice the "auth": "aslugifiedname" prop).

But if I change the query to:

import type { QueryBuilderParams } from "@nuxt/content/dist/runtime/types";
const query: QueryBuilderParams = {
  path: "/news",
  where: [{ auth: "aslugifiedname" }],
  // where: [{ auth: { $eq: "aslugifiedname" } }], // I also tried this version
  limit: 5,
  sort: [{ date: -1 }],
};

I get [] as a result.

What am I doing wrong? Why cant' I filter over this field? I thought it could be related to spaces so I tried with the slugified version, but no success.

Sunderam Dubey
  • 1
  • 11
  • 20
  • 40
Augustin Riedinger
  • 20,909
  • 29
  • 133
  • 206

1 Answers1

0

Might be silly, but have you tried to avoid the brackets in the where clause?

const query: QueryBuilderParams = { path: '/collab', where: { published: { $eq: true } }, limit: 15, sort: [{ authorship: -1 }] }

const { data: publishedQuery } = await useAsyncData('published', () => {
  return queryContent('/collab').where({ published: true }).sort({ authorship: -1 }).find()
})

If I keep the brackets, I also get a []. Without them, I get the expected results

Interesting that my IDE is complaining about the syntax, but the documentation in the code itself shows it should be valid.

dummy compilation error

QueryBuilderWhere declaration

MarcoAAlmeida
  • 1