> For the complete documentation index, see [llms.txt](https://docs.dashcomb.com/dashcomb-help-center/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.dashcomb.com/dashcomb-help-center/ide/ui-component/ui-component-button.md).
# Button
Buttonはフォームの送信やリセット機能を設置するためによく使うコンポーネントです。Dashcombが提供しているButtonは、通常のHTMLのButtonをベースにしています。加えて、管理画面の用途に合わせて、動作を柔軟に設定できるアクション機能を内蔵しています。
アクションはDashcombが提供している操作です。クエリ実行、メニューに移動、通知、コピーといった、一般的なデータ操作が提供されています。
Buttonコンポーネントにアクションを設定することで、管理画面に必要な様々な動作を実行することができます。
***
## プロパティ
Buttonコンポーネントには、以下のプロパティが含まれています。
### 共通
#### **オブジェクト**
ボタンオブジェクトの変数名です。Buttonコンポーネントをドラッグ＆ドロップすると、そのオブジェクトが自動的に `button1`、`button2`... と名付けられます。
ここで設定した変数名は、構文 `{{オブジェクト名.プロパティ}}` でオブジェクトを参照するために利用できます。
（例）`{{button1.hidden}}` で `button1` の表示状態の真偽値を取得することができます。
利用できるオブジェクトとプロパティは、[インスペクターメニュー](/dashcomb-help-center/ide/region/inspector-region.md) で確認できます。
#### 非表示
トグルスイッチをONにすると、ボタンが非表示になります。
#### 無効
トグルスイッチをONにすると、ボタンが無効になります。
***
### データ
#### **テキスト**
ボタンに表示されるラベルテキストです。Buttonコンポーネントをドラッグ＆ドロップすると、自動的に `Button` に設定されます。
`Button` を任意の文字列に入れ替えることはもちろん、構文 `{{オブジェクト名.プロパティ}}` を入れることにより、動的に設定することができます。
{% hint style="info" %}
`{{}}` 構文については、[オブジェクトやデータの参照](/dashcomb-help-center/ide/obujekutoyadtano.md) のページを参照してください。
{% endhint %}
（例）`Button` を `{{currentUser.name}}が提出` に書き換えると、ユーザー画面では、`ログイン中のユーザーの名前が提出` と表示されます。
現時点ではButtonのラベルはMarkdown記法をサポートしていません。
###
### アクション
Buttonコンポーネントのアクションは、以下を設定することができます。
**onClick**
ボタンのonClickイベントが発生する際に、指定アクションを実行できます。
{% hint style="info" %}
アクションの設定については、[アクションパネル](https://github.com/dashcomb/gitbook-doc/blob/master/ide/ui-component/broken-reference/README.md) のページを参照してください。
{% endhint %}
###
### 外観
#### **スタイル**
ボタンのスタイルを指定します。ノーマル、プライマリ、インポータント の3つから選択できます。
#### **ボタンの形**
ボタンの形を指定します。四角、丸 の2つから選択できます。