Notionで絞り込み親子タグ・カテゴリ・セレクトを（無理やり）実現する

親カテゴリから絞り込まれた形で子カテゴリを選択したい

本来、Notionで実現したかったテーブル構成の内容とカラム上での絞り込み

コンテンツDB

[テキスト] コンテンツ名
[リレーション: 複数選択可] 親分類をリレーション（親分類）から選択
[複数セレクト] 子分類を選択するとき、親分類DB内のフィールドで選択した値によって絞り込まれた形で子分類を選択できるようにする

親分類DB

[テキスト] 親分類名
[複数セレクト] 該当の親分類の中身となる子分類を選択

実現したかったデータベース構成とサンプルデータ

実際にサンプルデータ入りでテーブル内容を表すと、実現したい内容としては以下のような構成となります。

■ コンテンツDB

コンテンツ名	親分類（リレーション: 複数選択）	子分類（絞り込み+複数セレクト）
コンテンツ1	親分類1	子分類A_親1, 子分類C_親1
コンテンツ2	親分類2	子分類D_親2, 子分類E_親2
コンテンツ3	親分類1, 親分類2	子分類B_親1, 子分類E_親2

■ 親分類DB

親分類名（コンテンツDBとリレーション）	子分類（複数セレクト）
親分類1	子分類A_親1, 子分類B_親1, 子分類C_親1
親分類2	子分類D_親2, 子分類E_親2

Notionではカラム単位での絞り込みは不可

Notionでフィルタ設定可能なのは、あくまでデータベース全体（ビュー全体）に対してのみです。

そのため、上記のような「カラム単位での絞り込み」を実装することはできませんでした。

代替案: 選択可能項目を表示するカラムと親子判定カラムを設置する

そこで代替案として、以下の2カラムをコンテンツDBに追加するようにしました。

選択可能項目を表示するカラム（Lookup）

選択された親分類DBから、紐づいている子分類を一覧で表示します。

親子の紐づけを判定するロジックカラム（Formula）

ユーザーが選択した子分類が、その前に選択された親分類の中に含まれた内容かどうかを判別し、含まれるならOK（✅）, 含まれないならNG（❌）を表示します。

選択可能な子分類の一覧表示+親子判定ロジックを追加したデータベース

上記を追加したあとのコンテンツDBは下記のような構成・内容となりました。

コンテンツ名	親カテゴリ（リレーション: 複数選択）	選択可能な子カテゴリを一覧表示（Lookup）	実際に選択した子カテゴリ（複数セレクト）	親子判定（Formula）
コンテンツ1	親分類1	子分類A_親1, 子分類B_親1, 子分類C_親1	子分類A_親1, 子分類C_親1	✅
コンテンツ2	親分類2	子分類D_親2, 子分類E_親2	子分類D_親2, 子分類E_親2	✅
コンテンツ3	親分類1, 親分類2	子分類A_親1, 子分類B_親1, 子分類C_親1, 子分類D_親2, 子分類E_親2	子分類A_親1, 子分類E_親2	✅
コンテンツ4	親分類1	子分類A_親1, 子分類B_親1, 子分類C_親1	子分類D_親2	❌
コンテンツ5	親分類2	子分類D_親2, 子分類E_親2	（選択前）	-

実装した親子判定ロジック: Formula

下記のような内容で親子判定カラムをFormulaのロジックとして設置しました。


ifs(
prop("子カテゴリ").length() == 0,
"-", 

and(
	prop("子カテゴリ").length() > 0 ? includes(prop("選択可能な子カテゴリ"), prop("子カテゴリ").at(0)): true,
	prop("子カテゴリ").length() > 1 ? includes(prop("選択可能な子カテゴリ"), prop("子カテゴリ").at(1)): true,
	prop("子カテゴリ").length() > 2 ? includes(prop("選択可能な子カテゴリ"), prop("子カテゴリ").at(2)): true
	...（4つ以上の子カテゴリを設置する可能性がある場合はさらに条件文を追加）...
), 
"✅",

"❌")

コード内でprop(”子カテゴリ”)となっている部分は、現在はprop()表記を使わずともNotion上で選択可能です。

実装のポイント、Formulaコードの解説としては以下のとおり。

ifsを使って複数分岐（if, else if, else）を実装しています。

子カテゴリへの設置がない場合: “-”を表示
子カテゴリで選択された値が1つ以上ある場合: 子カテゴリのチェック

チェック結果がすべてOKなら”✅”を表示

子カテゴリのチェックでいずれかがNGだった場合: “❌”を表示

and()内: 子カテゴリに1つ以上の値が選択されている場合、その選択された子カテゴリが「選択可能な子カテゴリ」のなかに含まれているかどうかをincludes()で判別しています。

and内はif文を三項演算子で記述しています。

if condition ? then : else
Notionにおけるif文で記述すると if(condition, then, else)のようになります。

includes([”A”, “B”, “C”], “A”) → Trueを返します。第2引数はリストNG, 文字列でしか判別してくれないため、実際に選択した子カテゴリから1つずつ具体的な値をat()で取り出してチェックしています。
Notionにおけるformulaではfor, whileなどの繰り返しロジックは用意されていないため、設置する可能性のある子カテゴリの数だけ、判別チェック文の設置が必要です。（サンプルでは3つまでチェック実装）
ユーザーが選択する子カテゴリの個数がバラバラのため、prop("子カテゴリ").length() によって選択された子カテゴリの長さによってチェック実行の有無を場合分けしています。

これで、親子関係をもつカテゴリの入力とチェックが可能になりました。絞り込んだ状態での選択という完璧な解決策とはなりませんでしたが、なんとかご要望に応える形で実装が実現できたかと思います。

Tags: 📚Notion

NotionをWebサイト・ブログとして公開する4つのメリット。最高のライティング体験と高速表示