Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩）
在项目中往往会有这样的需求： 弹出框（或Popover）在 show 后，点击空白处可以将其 hide。针对此需求，整理了三种实现方式，大家按实际情况选择。当然，我们做项目肯定会用到 UI 框架，常...
2020-05-27
p5.js临摹动态图形的方法
本文实例为大家分享了p5.js临摹动态图形的具体代码，供大家参考，具体内容如下一、描述所临摹图像的规律1、图像由多个闪光圆点和圆点之间的连线组成
2、圆点的运动轨迹是随机的...
2020-05-27
使用p5.js实现动态GIF图片临摹重现
前言根据互动媒体技术老师的实验要求，临摹了一张GIF动态图，使用p5.js进行重现。
博客里面会有实现逻辑以及实现代码，在最后还会有一张自己实现的扩展图。原图实现步骤规律总结1...
2020-05-27
JavaScript提升机制Hoisting详解
前言
刚接触到JavaScript的时候，便知道JavaScript是按顺序执行的，是如浏览器的解析DOM树一样的流程，解析DOM结构的时候，如果遇到JS脚本或者外联脚本便会停止解析，继续下载脚本之...
2020-05-27
jquery 键盘事件 keypress() keydown() keyup()用法总结
事件的定义完整的 key press 过程分为两个部分：1. 按键被按下；2. 按键被松开。当按钮被按下时，发生 keydown 事件。keydown() 方法触发 keydown 事件，或规定当发生 keydown 事件...
2020-05-27
node.js使用fs读取文件出错的解决方案
今天配接口，使用fs模块读取json出现了错误'no such file or directory'，然后经查终于解决，特此记录。使用nodejs的fs模块读取文件时习惯用相对路径，但是运行的时候出现了上述的...
2020-05-27
JavaScript 作用域scope简单汇总
什么是作用域
程序的执行，离不开作用域，也必须在作用域中才能将代码正确的执行。所以作用域到底是什么，通俗的说，可以这样理解：作用域就是定义变量的位置，是变量和函数的可访问范...
2020-05-27
p5.js临摹旋转爱心
运用p5.js临摹旋转爱心，供大家参考，具体内容如下原图我的临摹效果不错的样子，让我们看看实现过程。第一步、分析原图GIF因为原图中旋转速度较快，无法用肉眼直观地找到规律。所以...
2020-05-27
vue父组件给子组件的组件传值provide inject的方法
一般情况下我们父子之间的传值用的是props，这个就不多说了，但是如果想让父给子组件的组件传值怎么办呢，这里我们就可以用到 provide 和 inject（依赖注入）provide/inject需要一起...
2020-05-27
p5.js实现故宫橘猫赏秋图动画
用p5.js实现一个小动画——故宫橘猫赏秋图互动媒体第二次作业要求我们手绘一幅动画，再用代码实现出动画。由于时间原因，手绘并没有画动画，而是以插画的形式画了一张，然后p5实现...
2020-05-27
p5.js实现简单货车运动动画
本文为大家分享了p5.js实现简单货车运动动画的具体代码，供大家参考，具体内容如下使用工具Visual Studio Code+p5.js下载地址Visual Studio Codep5.js目标在网页上画出一辆货车...
2020-05-27
p5.js绘制旋转的正方形
使用p5.js绘制旋转的正方形，供大家参考，具体内容如下要还原的效果图以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。首先建立画布大小，按照比例应该是5：3f...
2020-05-27
Vue 2.0双向绑定原理的实现方法
Object.defineProperty方法vue.js 是采用数据劫持结合发布者-订阅者模式的方式，通过Object.defineProperty()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发...
2020-05-27
JavaScript判断数组类型的方法
前言
JavaScript中关于数组的判定问题，一直都是一个必须要掌握的点，那么，运用知识，如何判断一个类型是数组，就需要有对JavaScript使用有着深入的了解。判断方法
一、Array.isArra...
2020-05-27
Vue 3.0双向绑定原理的实现方法
proxy方法vue.js 是采用数据劫持结合发布者-订阅者模式的方式，通过new Proxy()来劫持各个属性的setter，getter，在数据变动时发布消息给订阅者，触发相应的监听回调。Vue 3.0与Vue...
2020-05-27
nest.js 使用express需要提供多个静态目录的操作方法
场景在官方提供的文档中提供方式，
app.module.ts ServeStaticModule.forRoot({ rootPath: path.join(process.cwd(), 'static'), serveStaticOptions: { maxAge: 1000...
2020-05-27
微信小程序上传图片并等比列压缩到指定大小的实例代码
微信小程序官方API中 wx.chooseImage() 是可以进行图片压缩的，可惜的是不能压缩到指定大小。实际开发中需求可能是压缩到指定大小：原生js可以使用canvas来压缩，但由于微信小程...
2020-05-27
vue项目使用.env文件配置全局环境变量的方法
关于文件名：必须以如下方式命名，不要乱起名，也无需专门手动控制加载哪个文件.env 全局默认配置文件，不论什么环境都会加载合并.env.development 开发环境下的配置文件.env.produ...
2020-05-27
webpack4 配置 ssr 环境遇到“document is not defined”
最近使用 webpack 4 配置 ssr 环境，发现的问题：ReferenceError: document is not defined本次package.json使用版本信息：{ "vue-loader": "^15.4.2", "mini-css-extract-plug...
2020-05-27
js计时事件实现圆形时钟
本文实例为大家分享了js圆形时钟效果的具体代码，供大家参考，具体内容如下代码：<!DOCTYPE html><html><head> <meta charset="utf-8"/> <title>时钟</title> <style> *{margin:...
2020-05-27
JS控制GIF图片的停止与显示
在掷骰子游戏中，通过需要控制骰子的转动以及转动结果的显示，骰子的转动可以用GIF动图来实现，每次投掷骰子的结果可以通过点击按钮显示静态图片。代码如下：<!DOCTYPE html><html>...
2020-05-27
jquery实现掷骰子小游戏
本篇给大家分享一个很好玩的掷骰子游戏，当点击“掷筛子”按钮时张三和李四两人同时掷出筛子，在各自的文本框中会显示出各自掷出筛子的大小，并且会在第三个文本框中比较出两人点...
2020-05-27
使用jQuery实现掷骰子游戏
本文实例为大家分享了jQuery实现掷骰子游戏的具体代码，供大家参考，具体内容如下直接新建一个html页面，需要在head中引入jquery,js，一些css代码以及js代码，如下:<script type="tex...
2020-05-27
js实现简单掷骰子效果
本案例要实现的掷骰子效果：点击按钮，使骰子转动起来，转动随机时间之后，自动停止在某一个点数上。思路：点击按钮之后，将原本静态的骰子图片替换为一个动态转动的gif图片；
创建定时器...
2020-05-27
js实现GIF动图分解成多帧图片上传
在项目中遇到需要支持上传gif图片，并把其分解的帧图片一次展示给用户。话不多说直接上代码分解gif图片需要使用libgif-js这个库！1. 引入Git库import SuperGif from './libgif....
2020-05-27
Element-Ui组件 NavMenu 导航菜单的具体使用
本文来源于Element官方文档：http://element-cn.eleme.io/#/zh-CN/component/menu基础用法
普通导航菜单<el-menu :default-active="activeIndex" class="el-menu-demo" mode=...
2020-05-27
js实现掷骰子小游戏
本文实例为大家分享了js掷骰子小游戏的具体代码，供大家参考，具体内容如下因为这次作业是第一个实验，比较简单，但是要求面向对象来做，而我这个时候又刚好在学JS，JS来做骰子游戏即有...
2020-05-27
js实现GIF图片的分解和合成
无意中看到一篇文章写得是关于纯前端处理GIF图片的问题，感觉挺有意思的所以自己也实现了一下；主要用到的有两个第三方库：合成GIF图片的gif.js和分解的libgif.js;分解GIF1. 引入...
2020-05-27
js实现简单掷骰子小游戏
本文实例为大家分享了js掷骰子小游戏的具体代码，供大家参考，具体内容如下实现方法：
方法一：通过background-position、background-image、backg-repeat三个属性以及jquery anima...
2020-05-27
JS合并两个数组的3种方法详解
这篇文章主要介绍了JS合并两个数组的3种方法详解,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下需要将两个数组合并成...
2020-05-27
JS实现简单随机3D骰子
本文实例为大家分享了JS实现简单随机3D骰子的具体代码，供大家参考，具体内容如下描述：JS——实现简单的随机3D骰子。效果：实现：html文件：<!DOCTYPE html><html lang="en"> <head> <...
2020-05-27
windows实现npm和cnpm安装步骤
一、什么是npm和cnpmnpm（node package manager）：nodejs的包管理器，用于node插件管理（包括安装、卸载、管理依赖等）
cnpm:因为npm安装插件是从国外服务器下载，受网络的影响比较大，可...
2020-05-27
js实现随机div颜色位置 类似满天星效果
本文实例为大家分享了js实现随机div颜色位置的具体代码，供大家参考，具体内容如下效果如下：代码如下：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>MTX...
2020-05-27
js实现固定区域内的不重叠随机圆
本文实例为大家分享了js实现固定区域内的不重叠随机圆，供大家参考，具体内容如下关键词：js、固定区域、不重叠、随机圆，半径固定、半径随机最近公司有一个需求就是在一个固定的区...
2020-05-27
js实现转动骰子模型
本文创建了一个自动随机生成骰子数的模型，因为需要引入图片这里将图片省去了，自己导入图片即可验证代码<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>...
2020-05-27
Vue可自定义tab组件用法实例
在工作中我们常常要用到tab组件，如果有用第三方组件库的话一般都会有这个组件，但如果没有使用第三方组件库，或者想要自定义tab，那么或许这个无依赖的tab组件将会极大地节约你的...
2020-05-27
JS实现骰子3D旋转效果
本文实例为大家分享了JS实现骰子3D旋转效果展示的具体代码，供大家参考，具体内容如下css部分代码： .dice_box { width: 400px; height: 400px; position:relative; margin:0 aut...
2020-05-27
vue项目从node8.x升级到12.x后的问题解决
开始使用低于vue-cli3创建的项目，在更新node到12.x后，项目运行不起来了，这个让我想起我刚使用react时，安装的依赖，过了半年后，项目也运行不起来，在这了记录下(时间：2019-10-24)1.版...
2020-05-27
JS实现简单tab选项卡切换
本文实例为大家分享了JS实现简单tab选项卡切换的具体代码，供大家参考，具体内容如下本人在上一篇文章也写了用JS来实现tab选项卡切换效果，但是上次的那个代码比较复杂，这次是简化...
2020-05-27
vue-next/runtime-core 源码阅读指南详解
写在前面
最近又抽时间把 vue-next/runtime-core 的源码陆陆续续地看完了，期间整理了很多笔记，但都是碎片化的。本来是想整理一下，写成一篇文章分享出来的，但是感觉最终的成果物...
2020-05-27
15 分钟掌握vue-next函数式api(小结)
写在前面
在分享 vue-next 各个子模块的实现之前，我觉的有必要比较全面的整理下 vue-next 中提出的函数式 api，了解这些的话，无论是对于源码的阅读，还是当正式版发布时开始学习，...
2020-05-27
vue登录以及权限验证相关的实现
关键词：前后端分离、jwt、登录、权限验证最近在做一个小应用，需要用到vue实现登录，以及给不同路由设置权限。在网上看了很多文章，讲的是乱七八糟。感叹国内技术类文章实在是差劲...
2020-05-27
Nodejs实现图片上传、压缩预览、定时删除功能
前言我们程序员日常都会用到图片压缩，面对这么常用的功能，肯定要尝试实现一番。第一步，node基本配置这里我们用到的是koa框架，它可是继express框架之后又一个更富有表现力、更健...
2020-05-27
Vue 用Vant实现时间选择器的示例代码
1.查看Vant官网https://youzan.github.io/vant/#/zh-CN/datetime-picker引入Vant中DatetimePicker组件（全局引入后可直接使用）
import Vue from 'vue';import { DatetimePicke...
2020-05-27
详解node登录接口之密码错误限制次数(含代码)
密码次数尝试，可以有效的保护用户账户安全，有了限制之后，就算用量子计算机都束手无策。银行卡也是这种，尝试次数过多，就锁定，说不定还会自动报警。效果图 实现思路 数据库表设计...
2020-05-27
layui点击按钮页面会自动刷新的解决方案
问题：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" rel="ex...
2020-05-27
layUI的验证码功能及校验实例
用layUI的伙伴一定发现了：layUI的验证码是长死图！！！没错，是死图~~~~什么倒霉框架。下面代码是canvas验证码及校验。稍微修改及可用。我嵌套到项目里的效果如图：<!DOCTYPE html><ht...
2020-05-27
浅谈layui 表单元素的选中问题
layui对表单元素都作了美化,比如下拉列表,单选框,多选框.对表单美化后相应元素的操作,其实是在layui处理过后的div上操作,不能真的反映在原始我们编写的表单的元素上.这也会...
2020-05-27
vue中使用element ui的弹窗与echarts之间的问题详解
今天项目中有个需求，就是在页面中点击一个图标，弹出一个抽屉式的弹窗（弹窗是element UI的抽屉），弹窗里边是echarts呈现的数据，当我直接用echarts的时候，报错dom没有获取到；这就陷入...
2020-05-27
vue实现评论列表功能
具体代码如下所示：<!DOCTYPE html><html> <head> <title>简易评论列表</title> <meta charset="utf-8"> <link rel="stylesheet" href="node_modules\bootstrap\di...
2020-05-27
