Skip to main content

1. 概要

ページコンポーネントは、デザイナーにデフォルトで配置されています。YiDA ページのルートコンポーネントであり、ページ上の他のすべてのコンポーネントはこの内側にネストされます。 ページコンポーネントは 1 ページにつき 1 つのみ存在します。そのため、左側のコンポーネントライブラリには表示されず、コピーや削除もできません。

2. 設定エントリ

2.1 上部の「ページ設定」をクリック

デザイナーの上部ツールバーで、ページ設定をクリックします。デザイナー内でページコンポーネントが選択され、右側にその設定が表示されます。 フォーム編集ページ

3. 属性

属性設定

3.1 ページヘッダーを有効化

ページヘッダーを有効にすると、ページ上部に固定ヘッダーエリアが表示されます。このエリア内のプリセットスロットに、他のコンポーネントを追加できます。 デザイナー内でヘッダーをクリックすると、ヘッダーコンポーネントが選択され、設定が可能になります。左側のアウトラインツリーや右側のパンくずリストからヘッダーコンポーネントを選択することもできます。

3.1.1 ヘッダー属性

ヘッダーはスロットの集合体です。組み込みのスロットがいくつか用意されており、必要に応じて有効・無効を切り替えられます。 スロットを有効にすると、コンポーネントやテンプレートをドラッグして配置でき、カスタム効果を実現できます。 有効にしたスロットには、デフォルトでシステム推奨のコンポーネントが配置されます。必要に応じてコンポーネントを削除または追加できます。

3.1.2 ヘッダースタイル

コンポーネントの一般的なスタイル設定については、スタイル概要を参照してください。

3.2 ライフサイクル

パス: カスタムページフォーム >> ページ設定 >> 属性 >> ライフサイクル

3.2.1 ページ読み込み完了時

ページの読み込みが完了したときに実行するアクションを設定します。通常、カスタムの初期化ロジックを実行するために使用します。 「アクションをバインド」をクリックします。 アクション名を入力し、「確認」をクリックしてアクションの作成を完了します。 アクションパネルで、対応するビジネスロジックを記述します。 ビジネスロジックの記述方法については、JS アクションパネル - フロントエンドコードの開放性を参照してください。 バインド後、右側のアイコンをクリックすることで、コード内で位置を特定、コードの編集、またはアクションバインドの削除が行えます。

3.2.2 ページを閉じるとき

ページが閉じられたときにトリガーするアクションを設定します。手順は上記のページ読み込み完了時と同様です。

3.3 ページコンテンツ設定

3.3.1 PC 版とモバイル版の設定

PC 版のマージン、パディング、および背景色を設定します。 モバイル版のマージン、パディング、および背景色を設定します。

4. スタイル

コンポーネントの一般的なスタイル設定については、スタイル概要を参照してください。