怪物奇妙物语

宇宙无敌超级美少男的怪物奇妙物语

首页 新随笔 联系 管理
  819 随笔 :: 0 文章 :: 2 评论 :: 16万 阅读
<template>
<div class="absolute top-1/3 left-1/3 select-none">
<div class="flex justify-center w-full">
<kbd class="kbd w-16 h-12" @mousedown="goUpDown" @mouseup="goUpUp">▲</kbd>
</div>
<div class="flex justify-center gap-12 w-full">
<kbd class="kbd h-16 w-12" @mousedown="goLeftDown" @mouseup="goLeftUp">◀︎</kbd>
<kbd class="kbd h-16 w-12" @mousedown="goRightDown" @mouseup="goRightUp">▶︎</kbd>
</div>
<div class="flex justify-center w-full">
<kbd class="kbd w-16 h-12" @mousedown="goDownDown" @mouseup="goDownUp">▼</kbd>
</div>
</div>
</template>
<script setup lang="ts">
let timer:NodeJS.Timer|null = null
function startTimer(callback:()=>void){
timer = setInterval(callback,1000)
}
function setBgColor( e:MouseEvent,color:string){
(e.target as HTMLElement).style.backgroundColor=color;
}
function move(dir:string){
console.log(dir);
switch(dir){
case 'up':
break;
case 'down':
break;
case 'left':
break;
case 'up':
break;
default:
break
}
}
// judge the agv is moving
function isNaving():boolean{
// send http request to backend
// judge the current navigation is completed
return true
}
// run the agv
function runAgv(dir:string){
}
const goUpDown= (e:MouseEvent)=>{
setBgColor(e,'#44cef6')
startTimer(()=>{
move('up')
})
}
const goUpUp= (e:MouseEvent)=>{
clearInterval(timer!);
setBgColor(e,'#ffffff')
}
//----------------------------------------------------------------------------
const goLeftDown= (e:MouseEvent)=>{
setBgColor(e,'#44cef6')
startTimer(()=>{
move('left')
})
}
const goLeftUp= (e:MouseEvent)=>{
clearInterval(timer!);
setBgColor(e,'#ffffff')
}
//---------------------------------------------------------------------------
const goRightDown= (e:MouseEvent)=>{
setBgColor(e,'#44cef6')
startTimer(()=>{
move('right')
})
}
const goRightUp= (e:MouseEvent)=>{
clearInterval(timer!);
setBgColor(e,'#ffffff')
}
//--------------------------------------------------------------------------
const goDownDown= (e:MouseEvent)=>{
setBgColor(e,'#44cef6')
startTimer(()=>{
move('down')
})
}
const goDownUp= (e:MouseEvent)=>{
clearInterval(timer!);
setBgColor(e,'#ffffff')
}
</script>
<style scoped lang="less"></style>
posted on   超级无敌美少男战士  阅读(46)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战
点击右上角即可分享
微信分享提示