Lightning Web Componentsにおけるコンポーネントについて考える

Lightning Web Componentsで開発するときにとても大切な考え方は、ずばりコンポーネントです。

これはAngularなどにも同じ考え方があります。

コンポーネントという考え方を押さえて置かないと、できるはずのことができなかったり、簡単にできるのに複雑にやってしまったりと、いろいろと無駄なことがあります。

例えば、以下の発注画面について考えて見ましょう。

この発注画面では、明細ごとに「単価×数量」で合計を表示します。合計の合計をタイトル行の下に表示します。

どこをコンポーネントにしますか？

この場合、３つのコンポーネントで考えます。

・全体
・明細
・合計

明細コンポーネントは、数量が変更されたときに、「単価×数量」を算出して合計に値を表示するという役割があります。

合計コンポーネントは、各明細で数量が変わったときに全ての合計を集計して表示します。

明細を一行ごとにコンポーネントしないと、数量が変わった時にどの明細の数量が変わったのか、その単価はどれなのかなどを把握するのが難しくなります。

一行ごとがコンポーネント化されていると、数量が変化したことをキャッチし他時に使う単価は一つなので、合計は簡単に算出することができます。

もちろん、市販のグリッドコントロールを購入して使うのも一つの手段です。

費用がかかるので、まずは、どこをどのようにコンポーネントにすれば単純にできるのかを考えて見ましょう。