Vue移动端抽奖组件,用于刮刮卡抽奖场景,支持背景是图片,回调等功能。下面编程教程网小编给大家简单介绍一下具体实现代码!
vue组件安装
import { createApp } from "vue";
// vue
import { Scratchcard } from "@nutui/nutui-bingo";
const app = createApp();
app.use(Scratchcard);
vue基础用法
<template>
<nutbig-scratch-card
content="1000万"
:coverImg="coverImage"
></nutbig-scratch-card>
</template>
<script>
import { ref, onMounted } from "vue";
export default {
setup() {
const coverImage = ref("图片地址");
const opencard = () => {
console.log("刮开事件完成!");
};
return { coverImage };
},
};
</script>
以上是编程学习网小编为您介绍的“vue年会刮刮卡抽奖活动代码”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
织梦狗教程
本文标题为:vue年会刮刮卡抽奖活动代码


基础教程推荐
猜你喜欢
- 关于 html:带有可选侧边栏的流动内容 div 2022-09-21
- 定单管理上 JS表格排序第1/2页 2023-11-30
- css绘制透明三角形 2024-02-04
- 实例讲解Cookies欺骗与session欺骗入侵 2024-02-12
- CSS3中的元素过渡属性transition示例详解 2023-12-27
- Django操作cookie的实现 2024-02-12
- css float left布局换行不正常问题的解决 2024-01-25
- Spring Boot + Vue3 前后端分离 实战wiki知识库系统 2023-10-08
- JavaScript闭包原理及作用详解 2023-08-08
- 纯JS打造网页中checkbox和radio的美化效果 2023-12-01