自定义博客皮肤VIP专享

*博客头图：

点击选择上传的图片

格式为PNG、JPG，宽度*高度大于1920*100像素，不超过2MB，主视觉建议放在右侧，请参照线上博客头图

请上传大于1920*100像素的图片！

博客底图：

点击选择上传的图片

图片格式为PNG、JPG，不超过1MB，可上下左右平铺至整个背景

栏目图：

点击选择上传的图片

图片格式为PNG、JPG，图片宽度*高度为300*38像素，不超过0.5MB

主标题颜色：

RGB颜色，例如：#AFAFAF

Hover：

RGB颜色，例如：#AFAFAF

副标题颜色：

RGB颜色，例如：#AFAFAF

预览取消提交

自定义博客皮肤

上一步保存

qq_41264099的博客

原创抽奖程序 vue ts localStorage

lottery.vue <template> <img :src="bg" id="background" /> <div class="imageContainer" v-if="reset"> <card v-for="(luck, index) in luckyer.value" :key="index" :type="lotteryType"

2021-08-05 13:56:08 123 4

import { defineConfig, loadEnv } from 'vite' import vue from '@vitejs/plugin-vue' const port = 8080; // const mode = import.meta.env.MODE const proxy = (APP_NOTICE: string) => { let dic = { '/api': { target: 'http://172.20.61.1.

2021-08-03 15:08:23 802

原创抽奖应用vue3-ts-LocalStorage

显示页面(lottery.vue)： <template> <img id="bg" src="@/assets/bg.png" alt=""> <div class="card-container one"> <div :class="per_class" v-for="(item,index) in show_num" :key="item"> <!-- <video

2021-08-03 15:03:09 221

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

script-sb CSDN认证博客专家 CSDN认证企业博客

码龄6年

暂无认证

IP 属地：上海市

IP属地以运营商信息为准，境内显示到省（区、市），境外显示到国家（地区）

3: 原创

147万+: 周排名

49万+: 总排名

1146: 访问

: 等级

32: 积分

0: 粉丝

1: 获赞

4: 评论

0: 收藏

私信

关注

最新评论

抽奖程序 vue ts localStorage
script-sb: [code=javascript] <style scoped> .cardDisplay{ border: sandybrown; border-width: 10px; height: 1044px; width: 900px; z-index: 99999; margin: -300px; align-items: center; justify-content: center; } .videoDisplay{ height: 900px; } .digitDisplay{ position:absolute; top: 200px; color: white; font-size:36px; font-style: italic; } .area{ position: absolute; top: 39px; left: 365px; } .row{ position: absolute; top: 75px; left: 330px; } .seat{ position: absolute; top: 75px; left: 415px; } </style> [/code]
抽奖程序 vue ts localStorage
script-sb: [code=javascript] const showDigit = () => { afterPlay.value = true SetLocalStorage("clear",{"clear": true}) } watch(play,(item)=>{ if(item){ videoElement.value.play() } else{ afterPlay.value = false } }) return { type, srcDict, play, afterPlay, videoElement, area, row, seat, showDigit, } }, }) [/code]
抽奖程序 vue ts localStorage
script-sb: [code=javascript] 'account', 'car', 'diamond', 'earphone', 'mobilephone', ].includes(val) } }, play:{ type: Boolean, required: true, }, area:{ type: String, }, row:{ type: String, }, seat:{ type: String, }, }, setup(props, context) { const { type, play, area, row, seat } = toRefs(props) const videoElement = ref(); const afterPlay = ref(false) interface dictionary { [key: string]: string } const srcDict: dictionary = { 'account': account, 'car': car, 'diamond': diamond, 'earphone': earphone, 'mobilephone': mobilephone } const showDigit = () => { afterP [/code]
抽奖程序 vue ts localStorage
script-sb: [code=javascript] <template> <div class="cardDisplay"> <video :src="srcDict[type]" class="videoDisplay" muted :ref="el=>{videoElement = el}" @ended="showDigit"/> <div class="digitDisplay" v-if="afterPlay"> <p class="area">{{area}}</p> <p class="row">{{row}}</p> <p class="seat">{{seat}}</p> </div> </div> </template> <script lang="ts"> import SetLocalStorage from '@/composables/GSetLocalStorage' import { defineComponent, onMounted, ref, toRefs, watch} from 'vue' import account from '../assets/account.webm' import car from '../assets/car.webm' import diamond from '../assets/diamond.webm' import earphone from '../assets/earphone.webm' import mobilephone from '../assets/mobilephone.webm' export default defineComponent({ props: { type:{ type: String, required: true, validator: (val:string)=>{ return [ '', 'accou [/code]

原创 抽奖程序 vue ts localStorage

原创 vite预览环境的转发配置

原创 抽奖应用vue3-ts-LocalStorage

空空如也

空空如也

原创抽奖程序 vue ts localStorage

原创抽奖应用vue3-ts-LocalStorage