2021-01-06に投稿

Nuxt/Contentで日付による範囲検索をしたい

ハマりにハマった。

Nuxt/Content

最近、Nuxt/Contentというものをお試しで触っている。
Markdownとかでコンテンツをゴリゴリ書いていける、GitベースのヘッドレスCMSとかいうものになるらしい。「GitベースのヘッドレスCMS」とか言われてもよくわからないが、DBではなくGitで管理するということだと思う。
検索とか、なんなら全文検索もできるし結構便利そう。
ただ、公式ドキュメント以外に日本語の記事が乏しくて、ちょっと苦戦する。
ちょっと、というか、どハマりしてしまった。

ハマった環境

  • Nuxt: 2.14.6
  • nuxt/content: 1.9.0

日付でコンテンツを絞りたい

作成日でコンテンツを絞りたかったので、ドキュメントを参考にクエリを書いた。
ただ、日付の扱い方がよくわからなかったので嫌な予感はしていた。

// 例)2020/11の記事を検索したい
const monthStart = new Date("2020-11-01")
const monthEnd = new Date("2020-11-30")
const articles = await $content('articles')
    .sortBy('createdAt', 'desc')
    .limit(5)
    .where({
        createdAt: { $and: [{ $gte: monthStart }, { $lte: monthEnd }] },
    })
    .fetch()

これで11月に作成した記事の最新5件が取れるはずだった。

けど取れない

変数articlesの中身は空でした。なんで?
もしかしてDateじゃないのかなとか思って日付形式っぽい文字列にしてみてもダメ。
公式ドキュメントを探し直したけど、特に記述はなく……。
なんなら

createdAt: DateTime

とか書いてあるし、どう考えたってDateでしょ。

調べた

先述の通り、日本語の記事が乏しいうえ、公式ドキュメントに記載がないので苦戦したのだけど、調べて、見つけた。
あったよ。
ていうか、GitHubのissueだったよ!
まあ、内容としてはissueそのまんまなんだけど、

// 例)2020/11の記事を検索したい
const monthStart = new Date("2020-11-01").valueOf()
const monthEnd = new Date("2020-11-30").valueOf()
const articles = await $content('articles')
    .sortBy('createdAt', 'desc')
    .limit(5)
    .where({
        createdAt: { $and: [{ $gte: monthStart }, { $lte: monthEnd }] },
    })
    .fetch()

valueOf()なんて初めて使ったよ。てか、初めて知ったよ。
と思って調べてみたら、getTime()の方が正しい気がしてきたぞ?

このメソッドは、Date.prototype.getTime() メソッドと機能的に同等です。
このメソッドは、JavaScript によって内部的に呼ばれ、コード内で明示的に呼ばれることはありません。

// 例)2020/11の記事を検索したい
const monthStart = new Date("2020-11-01").getTime()
const monthEnd = new Date("2020-11-30").getTime()
const articles = await $content('articles')
    .sortBy('createdAt', 'desc')
    .limit(5)
    .where({
        createdAt: { $and: [{ $gte: monthStart }, { $lte: monthEnd }] },
    })
    .fetch()

うん、これでも動いた。

あー、UNIXタイムスタンプだったかー。ドキュメントに書いてて欲しいなー。

おわりに

issuesにはあったけど、日本語の記事があっても良いと思ったので書きました。
探し方が悪いだけかもしれませんが。

ツイッターでシェア
みんなに共有、忘れないようにメモ

hammhiko

恥を晒して生きていきます。

Crieitは誰でも投稿できるサービスです。 是非記事の投稿をお願いします。どんな軽い内容でも投稿できます。

また、「こんな記事が読みたいけど見つからない!」という方は是非記事投稿リクエストボードへ!

有料記事を販売できるようになりました!

こじんまりと作業ログやメモ、進捗を書き残しておきたい方はボード機能をご利用ください。
ボードとは?

コメント