uniapp如何对元素添加transition过渡动画？

基础过渡动画

<template>
	<view>
		<uni-section title="基础过渡动画" type="line"></uni-section>
		<view class="example-body">
			<button @click="open(['slide-top'])">slide-top</button>
			<button @click="open(['slide-left'])">slide-left</button>
			<button @click="open(['slide-right'])">slide-right</button>
			<button @click="open(['slide-bottom'])">slide-bottom</button>
			<button @click="open(['fade'])">fade</button>
			<button @click="open(['zoom-in', 'fade'])">zoom-in</button>
			<button @click="open(['zoom-out', 'fade'])">zoom-out</button>
		</view>
		<uni-transition :duration="500" :mode-class="modeClass" :styles="transfromClass" :show="transShow" @click="onTap">
			<text style="color: #fff;padding: 40px;background-color: #4CD964;">Test</text>
		</uni-transition>
	</view>
</template>
 
<script>
export default {
	components: {},
	data() {
		return {
			transShow: false,
			modeClass: ['fade'],
			maskClass: {
				position: 'fixed',
				bottom: 0,
				top: 0,...

点击查看剩余70%