46 lines
931 B
Markdown
46 lines
931 B
Markdown
|
---
|
||
|
|
title: Transition 过渡
|
||
|
|
description: 过渡组件。
|
||
|
|
spline: message
|
||
|
|
isComponent: true
|
||
|
|
---
|
||
|
|
|
||
|
|
|
||
|
|
## 引入
|
||
|
|
|
||
|
|
### 引入组件
|
||
|
|
|
||
|
|
可在 `main.ts` 或在需要使用的页面或组件中引入。
|
||
|
|
|
||
|
|
```json
|
||
|
|
"usingComponents": {
|
||
|
|
"t-transition": "tdesign-miniprogram/transition/transition"
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|
||
|
|
## 用法
|
||
|
|
|
||
|
|
### 组件方式
|
||
|
|
|
||
|
|
```xml
|
||
|
|
<!-- page.wxml -->
|
||
|
|
<t-transition
|
||
|
|
name="transition-class"
|
||
|
|
visible="{{ visible }}"
|
||
|
|
>
|
||
|
|
<view class="block" style="width: 100px; height: 100px; background: red;"></view>
|
||
|
|
</t-transition>
|
||
|
|
```
|
||
|
|
|
||
|
|
## API
|
||
|
|
|
||
|
|
### Transition Props
|
||
|
|
|
||
|
|
名称 | 类型 | 默认值 | 描述 | 必传
|
||
|
|
-- | -- | -- | -- | --
|
||
|
|
appear | Boolean | false | 首次出现是否展示动画 | N
|
||
|
|
destoryOnHide | Boolean | false | 隐藏时是否销毁内容 | N
|
||
|
|
durations | Number / Array | - | 指定过渡时间。TS 类型：`number \| number[]` | N
|
||
|
|
name | String | t-transition | 过渡类名 | N
|
||
|
|
visible | Boolean | false | 是否显示 | N
|