Button

Buttonはフォームの送信やリセット機能を設置するためによく使うコンポーネントです。Dashcombが提供しているButtonは、通常のHTMLのButtonをベースにしています。加えて、管理画面の用途に合わせて、動作を柔軟に設定できるアクション機能を内蔵しています。

アクションはDashcombが提供している操作です。クエリ実行、メニューに移動、通知、コピーといった、一般的なデータ操作が提供されています。

Buttonコンポーネントにアクションを設定することで、管理画面に必要な様々な動作を実行することができます。

プロパティ

Buttonコンポーネントには、以下のプロパティが含まれています。

ボタンオブジェクトの変数名です。Buttonコンポーネントをドラッグ＆ドロップすると、そのオブジェクトが自動的に button1、button2... と名付けられます。

ここで設定した変数名は、構文 {{オブジェクト名.プロパティ}} でオブジェクトを参照するために利用できます。

（例）{{button1.hidden}} で button1 の表示状態の真偽値を取得することができます。

利用できるオブジェクトとプロパティは、インスペクターメニューで確認できます。

トグルスイッチをONにすると、ボタンが非表示になります。

トグルスイッチをONにすると、ボタンが無効になります。

ボタンに表示されるラベルテキストです。Buttonコンポーネントをドラッグ＆ドロップすると、自動的に Button に設定されます。

Button を任意の文字列に入れ替えることはもちろん、構文 {{オブジェクト名.プロパティ}} を入れることにより、動的に設定することができます。

{{}} 構文については、オブジェクトやデータの参照のページを参照してください。

（例）Button を {{currentUser.name}}が提出 に書き換えると、ユーザー画面では、ログイン中のユーザーの名前が提出 と表示されます。

現時点ではButtonのラベルはMarkdown記法をサポートしていません。

Buttonコンポーネントのアクションは、以下を設定することができます。

onClick

ボタンのonClickイベントが発生する際に、指定アクションを実行できます。

アクションの設定については、アクションパネルのページを参照してください。

ボタンのスタイルを指定します。ノーマル、プライマリ、インポータントの3つから選択できます。

ボタンの形を指定します。四角、丸の2つから選択できます。

最終更新 7 か月前