SwipeActions

一个用于向行内容添加前置和后置滑动操作的 SwiftUI SwipeActions 组件

iOS

Included in Expo Go

GitHub

npm

更新日志

Recommended version:

~58.0.1

Expo UI SwipeActions 与官方 SwiftUI swipeActions 修饰符相匹配，可让你为行内容添加前置或后置操作。

安装

Terminal

- npx expo install @expo/ui

- yarn expo install @expo/ui

- pnpm expo install @expo/ui

- bun expo install @expo/ui

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

用法

SwipeActionsExample.tsx

import {
  Button,
  Host,
  List,
  Section,
  SwipeActions,
  Text,
} from '@expo/ui/swift-ui';

export default function SwipeActionsExample() {
  return (
    <Host style={{ flex: 1 }}>
      <List>
        <Section>
          <SwipeActions>
            <Text>Message from Expo</Text>

            <SwipeActions.Actions
              edge="leading"
              allowsFullSwipe={false}>
              <Button
                label="Pin"
                systemImage="pin"
                onPress={() => {}}
              />
            </SwipeActions.Actions>

            <SwipeActions.Actions edge="trailing">
              <Button
                label="Delete"
                systemImage="trash"
                role="destructive"
                onPress={() => {}}
              />
            </SwipeActions.Actions>
          </SwipeActions>
        </Section>
      </List>
    </Host>
  );
}

API

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

Components

`SwipeActions`

iOS

Type: React.Element<SwipeActionsProps>

Applies native SwiftUI swipe actions to its non-slot children.

SwipeActionsProps

`children`

iOS

Type: ReactNode

The regular content and SwipeActions.Actions action groups.

Inherited props

CommonViewModifierProps

`Actions`

iOS

Type: React.Element<SwipeActionsGroupProps>

The buttons revealed when the user swipes the regular content from an edge.

Types

`SwipeActionsEdge`

iOS

Literal type: string

Acceptable values are: 'leading' | 'trailing'