App Reactコンポーネント

Appコンポーネント
Appプロパティ
例

App Reactコンポーネントは、グローバルテーマ（iOSまたはMaterial）やその他の便利なグローバル変数を定義できるメインのAppコンポーネントです。

Konsta UIを他のフレームワーク（Framework7やIonicなど）と併用する場合は、代わりにKonstaProviderを使用する必要があります。

App コンポーネント

以下のコンポーネントが含まれています

App

App プロパティ

名前	タイプ	デフォルト	説明
component	文字列	'div'	コンポーネントのHTML要素
dark	真偽値	false	`dark:` バリアントを含める（ダークテーマ使用時）
safeAreas	真偽値	true	コンテナに `safe-areas` クラスを追加します。アプリコンテナがフルスクリーン要素の場合、画面のセーフエリアを適切に処理するために有効にする必要があります
theme	'ios' \| 'material' \| 'parent'	'material'	アプリのテーマ。 `'parent'` に設定すると、ルートの `<html>` 要素で `ios` または `md` クラスを探します。Framework7 や Ionic などの親フレームワークと併用する場合に便利です
touchRipple	真偽値	true	マテリアルテーマでタッチリップルエフェクトを有効にします。すべてのコンポーネントのタッチリップルをグローバルに無効にすることができます

例

App コンポーネントは、すべての Konsta UI コンポーネントのメインラッパーとして使用する必要があり、アプリ内に App コンポーネントは一度に1つだけ存在する必要があります

import React from 'react';
import { App } from 'konsta/react';

export default function MyApp() {
  return (
    <>
      {/* App component ideally should be the main root component */}
      <App theme="ios" safeAreas>
        {/* rest of Konsta UI components */}
      </App>
    </>
  );
}