App React 组件

App 组件
App 属性
示例

App React 组件是主要的应用程序组件，允许定义全局主题（iOS 或 Material）和其他有用的全局设置。

如果您将 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	在 Material 主题中启用触摸涟漪效果。允许全局禁用所有组件的触摸涟漪

示例

App 组件应作为所有 Konsta UI 组件的主要包装器使用，并且应用程序中一次只能有一个 App 组件

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>
    </>
  );
}