Leisure_Time-CSDN博客

原创 ES6飞机大战篇-游戏介绍（优先看）

首先进行演示：当中设计到了升级、攻击力、技能、暂停、敌机预设移动等等1.升级我才用的是比较传统的方式通过比率进行获取经验格式如下当前的等级除去比率乘敌机原本的血量除以比率这么做可以让他持续升级敌机也会随着等级提高血量变高。2.攻击力攻击力升级时会进行提升那么同样的在不同的等级将会发射多排子弹3.技能技能我目前想到了三个k：代表着体积缩小移动速度加快，相对应的攻击力将会变小l：跟踪子弹开启跟踪子弹持续3秒将会有10秒冷却i：火力全开将射速提高到 32

2022-01-21 14:50:00 2482 1

原创记录Object.defineProperty使用以及Proxy的使用

【代码】记录Object.defineProperty使用以及Proxy的使用。

2024-06-05 10:36:24 217

原创关于前端项目依赖的node版本冲突的问题

最近在几个不同的项目切换有老的项目有新的项目当中所需要的node版本冲突苦思半天后好像有个简单的办法来进行解决node冲突的问题。

2024-05-28 10:00:38 309

原创 vue3 setup标签使用总结

引入element-plus引入vuex 使用props定义emit事件使用watch监听propscomputed 计算函数refs 使用vue-router使用

2024-05-07 11:40:10 379 1

原创原生js实现扫雷

最近对扫雷比较感兴趣就打算模仿者写一下算法全程都是自己想到的不一定是标准的但是可以用效果图如下：实现过程以及原理：1 生成网格信息实现思路：1.1：生成网格其中则是最大格子数量，则是最大生成雷的数量，通过生成出来的数据可以包含以下信息：是否被扫开是否属于雷偏移量,y当前雷的坐标宽度。然后进行数据保存我是通过对象的形式进行保存的可以优化一些读取速度具体形式如下：实现代码如下：1.2 第一次开图我目前是的思路所以实现思路如下：其中获取到的坐标点通过的方式获

2023-10-24 17:34:22 136

原创解决 uni-app app使用 onBackPress 监听返回后关闭popup 以及使用 uni-simple-router 有冲突问题

解决问题：**app弹出popup框弹**出后用户使用**全面屏手势/虚拟按键返回** 关闭弹窗**阻止**页面跳转可以跨越层级进行关闭弹窗优点：监听页面返回如果有弹窗则先关闭弹窗阻止页面返回可跨越层级进行监听只需要定义在路由页面即可缺点：1.监听页面必须是路由页面（目前试下来是这样封装的组件是无法使用 onBackPress 来监听的）；2.如果当前路由没办法进行返回了则监听失效将会进入再按一次退出应用如不更改会导致第一次监听使用成功第二次无法返回问题

2022-11-28 17:59:03 1902 1

原创关于uviewui中设置uni.$u.setConfig后生效

app中增加设置字体大小的选项，由于官方中并没有将 `uni.$u.setConfig` 更改为动态的（*至少在目前使用的 2.0.27 版本中没有因为项目已经开发到后期了不方便直接升级ui的版本怕出问题所以就在原来的基础上打补丁 *）所以会出现设置了之后页面并没有任何变化

2022-11-25 16:00:48 2853

原创 jqGrid冻结列错行问题，将冻结表格（悬浮表格）与正常表格进行高度同步

老项目用到了 jqGrid表格当中如果使用了冻结表格后会出现高度不一致的情况解决办法是通过表格渲染完成后手动进行同步高度代码改动最小也最方便解决后效果：在中调用当前方法在中调用...

2022-07-04 13:12:45 772

原创 uniapp 中使用 router后监听再按一次退出应用

使用了后只需要监听路由堆栈就可以实现监听退出应用一个简易的再按一次退出应用就可以实现了相关链接：https://hhyang.cn/v2/start/cross/navLock.html

2022-06-24 16:36:18 1636 1

原创解决pad真机调试中 uvuew tabs 滑块不跟随的问题滑块出于内容最右侧的问题

pad真机调试中遇到了滑块位置不正确的问题图中滑块已经到了最右侧网页模拟没问题但是遇到了pad上面就位置错误在代码中添加就会回到最左侧测试下来并不影响功能使用

2022-06-24 14:42:22 2022

原创 uniapp调试ESC指令热敏打印机打印图片以及打印途中报10007特性不支持解决方案

图片需要通过 canvas进行处理预先在canvas上绘制然后读取图片打印途中报 10007 特性不支持解决方案可以看文章最后的描述设置完图片后我们就可以开始连接蓝牙打印机了思路就是1.先扫描蓝牙选中具体的 deviceId后进行连接蓝牙2.连接蓝牙后进行连接服务3.服务连接后进行获取特性分为三步三步完事后基本上就连上蓝牙了连完蓝牙画完图片之后呢我们就可以获取到具体的点位信息了打印获取完图片后调用打印打印代码如下：遇到部分错误解决方法如果设备特性 write

2022-06-17 14:31:09 2232 4

原创 ES6飞机大战篇-github托管游戏

研究了一下github 发现居然可以托管网页，我这个页面也没啥东西所以就设置了一下代理了一下这样就可以直接在线玩了。如果出现报错可以等待所有资源加载完毕毕竟是免费的托管避免不了的请求慢。。。。https://sdsgk.github.io/plane-ES6/index.html：游戏试玩地址...

2022-02-22 17:11:34 2043

原创 ES6飞机大战篇-增加补给效果

本次更新增加了补给效果目前只有两种效果增加攻击力 20%增加无敌时间 50%数据定义如下/** * describe：效果描述 * effTime：持续时间 */const effData = [ { describe: "增加 25% 攻击力，持续一分钟", describeEnd: "攻击力增幅时间结束", efftTime: 60000, nowEfftTime: 0, range: 0.25, keyName: 'hurt'

2022-02-18 15:27:08 521

原创 ES6飞机大战篇-增加游戏提示

这次更新添加了提示，动画效果采用的是animation来实现的先添加一个简易的动画效果。那么提示也很简单class Notice { constructor() { // 队列 this.noticeQueue = new Queue() // 提示dom this.noticeDom = noticeDom // 最大index this.maxIndex = 1 // 提示元素 this.noticeDom = noticeDo

2022-01-24 15:02:59 2575

原创 ES6飞机大战篇-切换渲染方式

众所周知如果使用canvas进行绘图的话那么gpu将会介入那可是一件大好事啊所以进行添加渲染方式切换代码如下： // 初始化画布function initCanvas() { clearCanvas(); playerImage.onload = () => { // 绘制玩家贴图 ctx.drawImage( playerImage, playerInfo.offsetLeft, playerInfo.offsetTop,

2022-01-21 14:24:00 143

原创 ES6飞机大战篇-添加子弹追踪功能

既然是飞机大战那必定少不了子弹追踪那么添加子弹追踪功能的实现如下：// 原文链接：https://blog.csdn.net/erweimac/article/details/82256087// https://blog.csdn.net/weixin_30756499/article/details/97551805// https://blog.csdn.net/looffer/article/details/8846159// https://github.com/processing

2022-01-21 14:17:34 915

原创 ES6飞机大战篇-敌机自动移动发射子弹

想要游戏变得有点难度的话就得让敌机自己动起来（移动轨迹提前设置好）那么就得单独的来进行控制敌机上下左右发射首先制作数据：/** * health：生命值 * width：宽度 * height：高度 * image：图片 * enemyMoveFunc：function 返回自动移动的数据 * timer：ms 执行时间间隔时间 * moveDirection：移动方向、按下的键位可以设置多个 , 作为分隔符将会同时按下 * distance：一次性移动多少距离 * isHide

2022-01-21 14:10:33 3629

原创 ES6飞机大战篇-数据存储的封装（object）

在飞机大战中需要处理的数据是大量的所以做到尽量的节省性能所以自己封装了一个数据的仓库众所周知 js的对象就是一个哈希表那么哈希表来进行存储的话那么将会性能提高（至少在存储删除方面特别快）class Store { constructor(data) { this.Store = data || {}; } // 通过id获取单个数据 getId(id) { return this.Store[id]; } // 检测是否存在 hasOwnPrope

2022-01-21 13:57:26 255

原创 ES6飞机大战篇-封装全局定时器

最近在编写飞机大战，开发到一半想到是否可以选择暂停游戏常见的清理就是用 clearTimerout 或者 clearInterval 那么如果数量多了就会出现一会儿有些没用清理有些没用情理的问题为了避免出现这些问题出现我尝试分装了一下定时器代码如下：class Interval { constructor(delayTimer) { this.intervalTimer = null; this.intervalFuncMap = {}; this.interva

2022-01-21 13:43:53 2400

原创 vue draggable实现拖拽效果

首先安装： npm ivuedraggable -s然后引入相对应的组件importDraggablefrom'vuedraggable';在components里面进行注册 <draggable class="dra...

2020-03-29 13:26:48 784

原创 TS使用命名空间报 Namespace not marked type-only declare错误解决

完整报错信息为:Namespace not marked type-only declare. Non-declarative namespaces are only supported experimentally in Babel中文翻译：命名空间未标记为仅声明类型。只有在Babel中实验性地支持非声明性名称空间这句话是值如果你单纯的使用明明空间，而不是导出的方式进行使用的话，...

2020-03-06 14:14:16 3310

原创 linux服务器使用nps进行内网穿透

首先安装内网穿透nps：使用wget进行下载wgethttps://github.com/ehang-io/nps/releases/download/v0.26.3/linux_arm64_server.tar.gz下载完后解压tar -zxvf linux_amd64_server.tar.gz在服务器安全组添加了8080的端口情况下，在防火墙关闭或则白名单的情况下...

2020-02-27 19:34:20 4126

原创 JavaScript按住鼠标左键选中元素，实现框选（Rubberband）效果

效果图：代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>选择</title> <style type="text/css"> body, html, h1, h2, h3, ...

2020-02-26 21:06:41 3095

原创解决React 中css-loader中的 options has an unknown property 'localIdentName'. These properties are valid

解决React中css-loader中的options has an unknown property 'localIdentName'. These properties are valid报错问题解决代码如下：const path = require('path') //引入path模块const HtmlWebpackPlugin = require('html-webpac...

2020-02-17 18:54:06 8292 3

原创解决webpack打包报错 No module factory available for dependency type: CssDependency

问题描述：在打包过程出现没有可用于依赖类型的模块CssDependency在vue.config.js中添加module.exports = { css: { extract: false }};就可以解决问题，我也查找到了相对应的文档，发现有些还是不能理解的，也不清楚怎么会发生这种，之前好好的，突然就不可以打包了原文如下：css...

2020-02-13 13:31:39 17663 7

原创使用webpack4x来进行打包项目

由于webpack4x以后的版本将webpack这个打包命令分开成为了webpack-cli这个模块，没有安装的情况会报One CLI for webpack must be installed. These are recommended choices会出现这种情况，那么如果按照给的提升输入y / yes，则会自动安装webpack-cli，但是安装后没有成功，还是找不...

2020-02-09 13:57:12 122

原创 JavaScript实现判断是否是质数

质数：只能被1或者自身整除<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>判断是否为质数</title> </head> <body> <script type="text/javascript"&g...

2020-02-04 12:33:33 363

原创 JavaScript实现哈希表(链地址法)HashTable

使用js实现哈希表，代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>哈希表，链地址法</title> </head> <body> <script type="text/javascrip...

2020-02-03 19:32:02 219

原创 linux 防止node开启一段时间后自动关闭

在linux中如果断开远程链接可能node也会随着关闭那么在node启动的命令中，加入 & 符号来进行防止自动关闭例如， node app &或者 nohup node app &两者应该都可以，这样node就不会自动退出了...

2020-01-31 13:18:51 2074

原创 Vue项目上线服务器遇到的问题，以及解决方法，后台使用的是node，附带node安装方法

第一个问题就是端口没打开在服务器管理的安全规则里面添加端口， tcp协议，这样就能访问到网页了，添加之后，记得重启服务器之后就可以将vue项目使用 npm run build 来进行打包了，放到相对应的位置，如果访问，则会自动查找index文件来打开第二个问题出现在后台方面，首先必须安装node这个是必须的，这个就有个坑，如果直接使用sudo yu...

2020-01-30 19:18:23 1025 1

原创 JavaScript关于函数中的this一些常见的问题

脑子也有转不过来的时候，这些this可能会出错<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>this</title> </head> <body> <div class="box" style="w...

2020-01-29 20:20:18 138

原创 JavaScript原生实现轮播图的滑动切换

实现了基本的效果，做了个简易的效果，可以触摸切换代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { padding: 0...

2020-01-27 14:41:25 288

原创 JavaScript数组去重的三种方法

介绍常用的三种方法代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>去重的方法</title> </head> <body> <script type="text/javascript">...

2020-01-25 19:10:10 120

原创 JavaScript实现简单的数字验证码

主要使用Math的随机数，附加去重代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>数字验证码</title> </head> <body> <input type="text" name="...

2020-01-22 21:31:06 555

原创 css3实现超好看的旋转动画

核心代码border-radius，以及animation:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>转啊转</title> <style type="text/css"> html,body,div,a,p,...

2020-01-17 21:38:36 579

原创 JavaScript实现双向链表es6

实现双向链表，代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>双向链表</title> </head> <body> <script type="text/javascript">...

2020-01-13 20:17:44 274

原创 JavaScript实现拖动图片到指定位置验证码

代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> * { padding: 0; margin: 0; list-sty...

2020-01-11 19:55:27 1722

原创使用Hbuilder打包vue项目app

vue项目， HBuilder / HBuilderX有的情况下第一步，使用HBuilder创建一个app项目，我使用的是HBuilderX，步骤如下：选择左上角，文件， -> 新建 -> 项目会出先这样的画面：那么我们选择 5+App那个选项，这样我们就有一个基本的app模板了然后我们在打包我们的vue项目，使用npm run builder...

2020-01-10 20:28:49 546

原创 JavaScript栈结构的进制转换10转2

栈结构的应用案例，将10进制转为2进制，代码如下：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>转换进制</title> </head> <body> <script type="text/java...

2020-01-09 16:31:46 118

原创 JavaScript使用Math.atan2来实现眼睛跟随鼠标移动

利用Math.atan2来获取函数返回x在正x轴和射线之间的平面角度（以弧度为单位）代码如下:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>Math.atan2,getBoundingCLientRect</title> <...

2020-01-06 19:47:33 443

空空如也

空空如也