uni.createAnimation(OBJECT) 这个API绑定的animation在H5端不支持

uni.createAnimation(OBJECT) 这个API在H5端，当只有单独一个的时候有效。配合v-for使用，就无效了，有大佬能解决吗

<template>  
    <view class="content">  
        <view class="item" v-for="(item,index) in list" :key="item.id">  
            <view class="left"> {{item.memo}} </view>  
            <view class="right" @click="praiseMe(index)">  

                <image src="../../static/street.png"></image>  
                <view class="font11">点赞</view>  
                <view :animation="animationDataArr[index]" class="praise-me animation-opacity"> +1 </view>  
            </view>  
        </view>  

    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                list: [{  
                        id: "001",  
                        memo: "苹果"  
                    },  
                    {  
                        id: "002",  
                        memo: "橘子"  
                    },  
                    {  
                        id: "003",  
                        memo: "草莓"  
                    },  
                    {  
                        id: "004",  
                        memo: "香蕉"  
                    }  
                ],  
                animationData: {},  
                animationDataArr: [],  

            };  
        },  
        onLoad() {  
            // 1 在页面创建的时候，创建一个临时动画对象  
            this.animation = uni.createAnimation();  
            this.animationDataArr = Array(this.list.length).fill({});  

        },  
        onUnload() {  
            // 5 页面卸载的时候，清除动画数据  
            this.animationData = {};  
            this.animationDataArr = Array(this.list.length).fill({});  
        },  
        methods: {  
            // 实现点赞动画效果  
            praiseMe(index) {  
                // 2 调用 step() 来表示一组动画完成  
                this.animation.translateY(-90).opacity(1).step({  
                    duration: 400  
                });  

                // 3 通过动画实例的export方法导出动画数据传递给组件的animation属性  
                this.animationData = this.animation;  
                this.animationDataArr[index] = this.animationData.export();  

                // 4 还原动画  
                setTimeout(() => {  
                    this.animation.translateY(0).opacity(0).step({  
                        duration: 0  
                    });  
                    this.animationData = this.animation;  
                    this.animationDataArr[index] = this.animationData.export();  
                }, 600)  
            }  
        }  
    };  
</script>  

<style scoped>  
    .item {  
        display: flex;  
        align-items: center;  
        text-align: center;  
        border: 1px pink solid;  
        margin-top: 20rpx;  
        padding: 20rpx 0;  
    }  

    .item image {  
        width: 80rpx;  
        height: 80rpx;  
        z-index: 10;  
    }  

    .item .left {  
        flex: 1;  
    }  

    .item .right {  
        width: 300rpx;  
        border-left: 1px pink dashed;  
        padding-top: 50rpx;  
    }  

    .praise-me {  
        font-size: 14px;  
        color: #feab2a;  
    }  

    .animation-opacity {  
        font-weight: bold;  
        opacity: 1;  
    }  
</style>