以下用 VUE3 语法 举例使用:
npm install js-confetti
<script setup lang="ts">
import JSConfetti from 'js-confetti'
const confetti = new JSConfetti()
function showConfetti() {
confetti.addConfetti()
}
</script>
<template>
<h1 @click="showConfetti">🎉 Congratulations!</h1>
</template>
<style scoped>
h1 {
text-align: center;
cursor: pointer;
/* 禁止双击自动选择文本 */
/* 火狐 */
-moz-user-select: none;
/* Safari 和 欧朋 */
-webkit-user-select: none;
/* IE10+ and Edge */
-ms-user-select: none;
/* Standard syntax 标准语法(谷歌) */
user-select: none;
}
</style>