66
77<p align =" center " ><a href =" ./README.md " >English</a > | 简体中文</p >
88
9-
109<div align =" center " >
1110
1211[ ![ NPM version] [ npm-image ]] [ npm-url ] [ ![ npm download] [ download-image ]] [ download-url ] [ ![ build status] [ github-actions-image ]] [ github-actions-url ] [ ![ Codecov] [ codecov-image ]] [ codecov-url ] [ ![ bundle size] [ bundlephobia-image ]] [ bundlephobia-url ] [ ![ dumi] [ dumi-image ]] [ dumi-url ]
1312
1413</div >
1514
16-
1715## 特性
1816
1917- 用于出现、进入和离开状态的声明性 ` CSSMotion ` 组件。
@@ -76,7 +74,7 @@ npm start
7674
7775| 参数 | 类型 | 默认值 | 说明 |
7876| --- | --- | --- | --- |
79- | children们 | ` (props, ref) => ReactElement ` | - | 接收运动类、样式和引用的渲染函数。 |
77+ | children | ` (props, ref) => ReactElement ` | - | 接收运动类、样式和引用的渲染函数。 |
8078| forceRender | ` boolean ` | ` false ` | 即使元素不可见也保持渲染。 |
8179| leavedClassName | ` string ` | - | 当元素保留时,在离开后应用className称。 |
8280| motionAppear | ` boolean ` | ` true ` | 启用出现运动。 |
@@ -86,7 +84,7 @@ npm start
8684| motionLeaveImmediately | ` boolean ` | - | 安装后立即触发离开。 |
8785| motionName | ` string \| MotionName ` | - | CSS className前缀或每阶段className。 |
8886| removeOnLeave | ` boolean ` | ` true ` | 离开后删除该元素。设置 ` forceRender ` 时忽略。 |
89- | 可见的 | ` boolean ` | ` true ` | 控制元素是否可见。 |
87+ | visible | ` boolean ` | ` true ` | 控制元素是否可见。 |
9088| onAppearActive | ` MotionEventHandler ` | - | 在出现活跃阶段期间触发。 |
9189| onAppearEnd | ` MotionEndEventHandler ` | - | 出现完成时触发。返回` false ` 继续等待。 |
9290| onAppearPrepare | ` MotionPrepareEventHandler ` | - | 在出现开始之前准备回调。 |
@@ -107,19 +105,19 @@ npm start
107105
108106| 参数 | 类型 | 默认值 | 说明 |
109107| --- | --- | --- | --- |
110- | children们 | ` (props, ref) => ReactElement ` | - | 每个关键项目的渲染函数。 |
108+ | children | ` (props, ref) => ReactElement ` | - | 每个关键项目的渲染函数。 |
111109| component | ` string \| ComponentType \| false ` | ` div ` | Wrapper component. Use ` false ` for no wrapper. |
112110| keys | ` (React.Key \| { key: React.Key })[] ` | - | Keys to animate. |
113111| onAllRemoved | ` () => void ` | - | 在移除每个留下的项目后触发。 |
114112| onVisibleChanged | ` (visible, info: { key: React.Key }) => void ` | - | 项目可见性更改后触发。 |
115113
116114### Ref
117115
118- | Ref method | 类型 | 说明 |
119- | --- | --- | --- |
120- | ` enableMotion ` | ` () => boolean ` | 当前是否启用运动。 |
121- | ` inMotion ` | ` () => boolean ` | 元素是否处于运动生命周期中。 |
122- | ` nativeElement ` | ` HTMLElement ` | 当前 DOM 元素。 |
116+ | Ref method | 类型 | 说明 |
117+ | --------------- | --------------- | ------------------------- --- |
118+ | ` enableMotion ` | ` () => boolean ` | 当前是否启用运动。 |
119+ | ` inMotion ` | ` () => boolean ` | 元素是否处于运动生命周期中。 |
120+ | ` nativeElement ` | ` HTMLElement ` | 当前 DOM 元素。 |
123121
124122## 本地开发
125123
0 commit comments