This is documentation for the next SDK version. For up-to-date documentation, see the latest version (SDK 55).

DisclosureGroup

用于显示可展开内容的 SwiftUI DisclosureGroup 组件。

iOS

GitHub

npm

更新日志

Expo UI DisclosureGroup 与官方 SwiftUI DisclosureGroup API 保持一致，并显示一个披露指示器，用于展开或隐藏内容。

安装

Terminal

- npx expo install @expo/ui

If you are installing this in an existing React Native app, make sure to install expo in your project.

用法

基本披露组

BasicDisclosureGroupExample.tsx

import { Host, DisclosureGroup, Text } from '@expo/ui/swift-ui';

export default function BasicDisclosureGroupExample() {
  return (
    <Host matchContents>
      <DisclosureGroup label="更多信息">
        <Text>当披露组展开时，将显示此内容。</Text>
      </DisclosureGroup>
    </Host>
  );
}

初始展开

将 isExpanded 初始设置为 true，即可默认显示内容。

InitiallyExpandedExample.tsx

import { useState } from 'react';
import { Host, DisclosureGroup, Text } from '@expo/ui/swift-ui';

export default function InitiallyExpandedExample() {
  const [isExpanded, setIsExpanded] = useState(true);

  return (
    <Host matchContents>
      <DisclosureGroup label="详情" isExpanded={isExpanded} onIsExpandedChange={setIsExpanded}>
        <Text>此内容默认可见。</Text>
      </DisclosureGroup>
    </Host>
  );
}

API

import { DisclosureGroup } from '@expo/ui/swift-ui';

Component

`DisclosureGroup`

iOS

Type: React.Element<DisclosureGroupProps>

DisclosureGroupProps

`children`

iOS

Type: ReactNode

`isExpanded`

iOS

Optional • Type: boolean

Controls whether the disclosure group is expanded.

`label`

iOS

Type: string

`onIsExpandedChange`

iOS

Optional • Type: (isExpanded: boolean) => void

A callback that is called when the expansion state changes.

Inherited Props

CommonViewModifierProps