Button
Buttonコンポーネントは、ユーザーがクリックすることで指定された操作するためのコンポーネントです。色、サイズ、形式(ボタン、送信)をカスタマイズが可能です。
基本的な使い方
import { Card, Form, Flexbox, Button } from "@basemachina/view";
const App = () => {
return (
<Card>
<Form
onSubmit={() => {
console.log("clicked");
}}
>
<Flexbox direction="col">
<Button type="submit" title="送信" color="blue" />
</Flexbox>
</Form>
</Card>
);
};
export default App;

詳細なインターフェース
名前 | 説明 | 必須・任意 | デフォルト値 |
---|---|---|---|
title | ボタンのテキストを指定します。 | 必須 | なし |
color | ボタンの色を指定します。blue 、red 、white の中から選択可能です。 | 任意 | white |
size | ボタンのサイズを指定します。xs 、sm 、md 、lg 、xl の中から選択可能です。 | 任意 | md |
disabled | ボタンが無効化されているかどうかを指定します。true の場合、ボタンはクリックできません。 | 任意 | false |
type | ボタンのタイプを指定します。button またはsubmit を選択可能です。 | 任意 | button |
onClick | ボタンがクリックされたときに実行する関数を指定します。 | 任意 | なし |