You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
|
1 year ago | |
---|---|---|
.. | ||
README.md | 1 year ago | |
index.d.ts | 1 year ago | |
index.js | 1 year ago | |
props.d.ts | 1 year ago | |
props.js | 1 year ago | |
transition.d.ts | 1 year ago | |
transition.js | 1 year ago | |
transition.json | 1 year ago | |
transition.wxml | 1 year ago | |
transition.wxss | 1 year ago | |
type.d.ts | 1 year ago | |
type.js | 1 year ago |
README.md
title | description | spline | isComponent |
---|---|---|---|
Transition 过渡 | 过渡组件。 | message | true |
引入
引入组件
在 app.json
或 page.json
中引入组件:
"usingComponents": {
"t-transition": "tdesign-miniprogram/transition/transition"
}
用法
组件方式
<!-- page.wxml -->
<t-transition
name="transition-class"
visible="{{ visible }}"
>
<view class="block" style="width: 100px; height: 100px; background: red;"></view>
</t-transition>
API
<transition>
组件
组件路径:tdesign-miniprogram/transition/transition
过渡类名
过渡类名指定格式同 vue,enter/enter-to leave/leave-to
Props
属性 | 值类型 | 默认值 | 说明 |
---|---|---|---|
name | String | 't-transition' | 过渡类名,类似 vue 过渡类名 |
visible | Boolean | false | 是否显示 |
customClass | String | false | 自定义容器类名 |
destoryOnHide | Boolean | false | 隐藏之后是否渲染 slot 内容 |
appear | Boolean | false | 首次出现是否展示动画 |
durations | Number / Boolean | 手动指定过渡时间 |