Open1

Mehログ 2023-11

hirospherehirosphere

2023/11/11

手前用リアクティブDOMライブラリ「Meh」開発の試行錯誤日誌。

順序とは? 選択とは?

何らかの値があって、それの[リアクティブな]リスト化・順序付けや選択・非選択その他の「修飾」をモデル表現したい時。

修飾機能の分「修飾オブジェクト」を介すると「値」へのアクセスが冗長になってしまいます。

type Value = { name : string ; age : "秘密 " | "教えない" | "貴方にだけ" };
type Order < V > = { order : ReactiveNumber ; value : V ; };
type SelItem < V > = { selected : ReactiveBoolean ; value : V ; };

const ListItemUI = ( selitem : SelItem < Order < Value > > ) => {
    return li( {
            class: { selected: selitem.selected },
            acts: { click() { selitem.select() } }
        },
        selitem.value.order, ": ",
        selitem.value.value.name    //  ← value がくどい。
    );
};

「ブラウザにはじめから入っていれば良かったな」な機能の追求のためには、使いやすさや名前の簡潔さが必要なので色々迷います。

「りんご・バナナ・みかん」ちょっとした選択リストから、サイトのディレクトリツリーまで一意に扱えるような。

とりあえず「順序・選択」を一層にしたそれを展開してみましょう。