やること表

ブラウザで動くやること表です。追加、完了、削除、絞り込みがあります。

アクタが三つ

Todos   一覧と、入力途中の文字と、絞り込み
Clock   自分のタイマーで刻む時計
Page    その二つを参照で持つ外枠

時計を入れてあるのは、時計が刻んでも一覧が描き直されないことを見せるためです。

Page が持っているのは Todos と Clock への参照です。時計が刻んで自分を描き直しても、Page の状態は動きません。Page が描き直されたとしても、子は参照が変わっていないので、そこに降りていきません。

これは付け忘れられる最適化ではありません。参照が同じかどうかを見ているだけです。

入力途中の文字

打ちかけの文字は Todos が持っています。一覧が描き直されても、入力欄の中身は消えません。

一覧の行には key: を付けてあります。並べ替えや削除で行が動いても、節点は作り直されずに移動します。

マークアップ

デザイナの HTML にある項目の見本を複製しています。ここでも、LPScript の側に HTML はありません。