更新记录

1.2.0（2025-01-07） 下载此版本

优化效果

1.1.0（2024-03-29） 下载此版本

更新配置

1.0.0（2023-04-07） 下载此版本

全屏烟花特效

平台兼容性

uni-app

其他

支持扫码体验-见右侧二维码 组件Id：P11，组件详细接入请看接入指南

复制代码<template>
    <div>
        <view class="button-list">
            <view class="button-item" @click="handleShowEffect('snow')">
                雪花特效
            </view>
            <view class="button-item" @click="handleShowEffect('fireworks')">
                烟花特效
            </view>
            <view class="button-item" @click="handleShowEffect('schoolpride')">
                礼花特效
            </view>
            <view class="button-item" @click="handleShowEffect('realistic')">
                喜庆特效
            </view>
            <view class="button-item" @click="handleShowEffect('stars')">
                星星特效
            </view>
            <view class="button-item" @click="handleShowEffect('all')">
                全部特效
            </view>
        </view>
        <firework-effect ref="fireworkEffects"></firework-effect>
    </div>
</template>

<script>
    export default {
        data() {
            return {};
        },
        methods: {
            handleShowEffect(type) {
                this.$refs.fireworkEffects.handleShowEffect({
                    type, //snow fireworks schoolpride realistic stars all
                })
            },
        }
    }
</script>
<style lang="scss">
    .button-list {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        width: 340rpx;
        margin: 200rpx auto 0 ;
    }

    .button-item {
        margin: 12rpx 0 0 12rpx;
        padding: 12rpx 24rpx;
        text-align: center;
        display: inline-block;
        border-radius: 12rpx;
        background: linear-gradient(to right, #FEEF3C, #F3CD34);
    }
</style>