🍀

Valibotで特定の数値、bool値、文字列を扱う

2024/10/05に公開

結論

literal を使おう

本編

公式のドキュメントは以下
https://valibot.dev/api/literal/

literal は日本語で「文字通りの」という意味があるので、"文字通り" 文字通りのスキーマを作ることができます。

対応している型はnumber, boolean, string です。

サンプル

数値

import * as v from "valibot";

const Schema = v.literal(2024);

const valid = v.safeParse(Schema, 2024);
const invalid = v.safeParse(Schema, 30000);

console.log("valid", valid);
console.log("invalid", invalid);

// 出力
// valid {
//   typed: true,
//   success: true,
//   output: 2024,
//   issues: undefined,
// }

// invalid {
//   typed: false,
//   success: false,
//   output: 30000,
//   issues: [
//     {
//       kind: "schema",
//       type: "literal",
//       input: 30000,
//       expected: "2024",
//       received: "30000",
//       message: "Invalid type: Expected 2024 but received 30000",
//       ...
//     }
//   ],
// }

Bool 値

import * as v from "valibot";

const Schema = v.literal(false);

const valid = v.safeParse(Schema, false);
const invalid = v.safeParse(Schema, true);

console.log("valid", valid);
console.log("invalid", invalid);

// 出力
// valid {
//   typed: true,
//   success: true,
//   output: false,
//   issues: undefined,
// }

// invalid {
//   typed: false,
//   success: false,
//   output: true,
//   issues: [
//     {
//       kind: "schema",
//       type: "literal",
//       input: true,
//       expected: "false",
//       received: "true",
//       message: "Invalid type: Expected false but received true",
//       ...
//     }
//   ],
// }

文字列

import * as v from "valibot";

const Schema = v.literal("Hello World!");

const valid = v.safeParse(Schema, "Hello World!");
const invalid = v.safeParse(Schema, "Goodbye World!");

console.log("valid", valid);
console.log("invalid", invalid);

// 出力
// valid {
//   typed: true,
//   success: true,
//   output: "Hello World!",
//   issues: undefined,
// }

// invalid {
//   typed: false,
//   success: false,
//   output: "Goodbye World!",
//   issues: [
//     {
//       kind: "schema",
//       type: "literal",
//       input: "Goodbye World!",
//       expected: "\"Hello World!\"",
//       received: "\"Goodbye World!\"",
//       message: "Invalid type: Expected \"Hello World!\" but received \"Goodbye World!\"",
//       ...
//     }
//   ],
// }

あとがき

Valibot は日本語の解説記事が少ないので、バリデーションライブラリを使ったことがない人にとっては情報収集が難しいと思っています。
こういったシンプルな記事が少しでもそういった人たちの助けになれば嬉しいです。

Discussion