AlierView: hide()

対象の AlierView に取り付けられた ViewLogic のコンテナの内容を非表示にします。

info
  • 非表示状態のコンテナの内容を表示にするには show() を使います

構文

alierView.hide() => void

const vl = new class extends ViewLogic {
    constructor() {
        super();
        this.loadContainer({
            text: `<div id="hello"><p>Hello!</p></div>`,
            id: "hello"
        });
        this.relateElements(this.collectElements(this.container));
    }

    async messageHandler(msg) {
        msg.deliver({
            hide: () => {
                //  this.host が設定されていればコンテンツを非表示にする
                this.host?.hide();
            },
            show: () => {
                //  this.host が設定されていればコンテンツを表示する
                this.host?.show();
            },
        });
    }
};

//  vl を Alier.View へ取り付ける
Alier.View.attach(vl);

vl.post(vl.message("hide"));
//  ==>  vl のコンテンツが非表示になる

vl.post(vl.message("show"));
//  ==>  vl のコンテンツが Alier.View の中に表示される

解説

コンテンツを保持するコンテナ要素の visibilityhidden に変更します。

取り付けられたコンテナがない場合、この関数は何もしません。