webpack的移动端适配方案小结
目录rem
vw
适配第三方UI框架
结语
在移动端开发的过程中，一个最常见的问题就是适配不同的屏幕宽度。目前比较常见的适配方案有rem和vw，它们都是css中的相对单位。rem
W3C对re...
2021-08-10
JavaScript分页组件使用方法详解
分页组件是web开发中常见的组件，请完成pagination函数，在id为jsPagination的DOM元素中完成分页的显示部分，需求如下1、最多连续显示5页，居中高亮显示current页（如demo1所示)
2、t...
2021-08-10
JavaScript canvas实现俄罗斯方块游戏
俄罗斯方块是个很经典的小游戏，也尝试写了一下。不过我想用尽量简洁逻辑清晰的代码实现。不用过多的代码记录下落方块的模型，或者记录每一个下落方块的x,y。想了下面的思路，然...
2021-08-10
关于vue3编写挂载DOM的插件问题
vue3 跟 vue2 相比，多了一个 app 的概念，vue3 项目的创建也变成了// main.jsimport { createApp } from 'vue'import App from './App.vue'import ElementPlus from 'element-...
2021-08-10
vue实现旋转木马动画
本文实例为大家分享了vue实现旋转木马动画的具体代码，供大家参考，具体内容如下图片数量可为任意值都能正常处理 [1-无限个]：<!DOCTYPE html><html><head> <title></title>...
2021-08-10
Element树形控件整合带图标的下拉菜单(tree+dropdown+input)
目录需求说明：实现步骤：本文主要讲述：自定义树形控件<el-tree>需求说明：Element UI 官网提供的树形控件包含基础的、可选择的、自定义节点内容的、带节点过滤的以及可拖拽节点的...
2021-08-10
react为什么不推荐使用index作为key
1.旧的虚拟dom和新的虚拟dom对比，首先看他们的key是否相同
2.相同继续对比他们的内容，不同生成新的真实dom进行替换
3.如果内容和key都相同，复用旧的真实dom 不做改变
那么如果...
2021-08-10
node.js做一个简单的爬虫案例教程
准备工作 首先，你需要下载 nodejs，这个应该没啥问题吧 原文要求下载 webstrom，我电脑上本来就有，但其实不用下载，完全在命令行里面操作就行创建工程准备工作做完了，下面就开...
2021-08-10
TypeScrip中泛型的案例详解
泛型的定义// 需求一： 泛型 可以支持不特定的数据类型， 要求，传入的参数和返回参数一致// 这种方式虽然能实现传入和返回的参数一致，但是失去类型参数检验/*function getData(va...
2021-08-10
TypeScript定义接口(interface)案例教程
接口的作用：接口，英文：interface，其作用可以简单的理解为：为我们的代码提供一种约定。在Typescript中是这么描述的： TypeScript的核心原则之一是对值所具有的结构进行类型检查...
2021-08-10
vue实现一个滚动条样式
起初是想修改浏览器滚动条样式来达到效果
但是查阅了资料 浏览器滚动条不能修改宽度与位置
没办法只能自己写
首先是滚动条样式<div class="scrollBar" v-if="roleList.leng...
2021-08-10
React中useEffect 与 useLayoutEffect的区别
目录前置知识
useEffect
commitBeforeMutationEffects
commitMutationEffects
commitLayoutEffects
后续阶段
useLayoutEffect
结论
前置知识
我们可以将 React 的工作流程...
2021-08-10
JavaScript css3实现简单视频弹幕功能
本文尝试写了一个demo模拟了最简单的视频弹幕功能。思路：设置一个<div>和所播放的video的大小一致，把这个div标签蒙在video上面用于放置弹幕。在video的右边放一个<ul>列表用...
2021-08-10
vue中实现全屏以及对退出全屏的监听
目录前言： 实现步骤：完整源码：更多资料：前言： vue中实现默认进来页面，某个div全屏，并监听退出全屏的次数，当退出全屏次数达到5的时候跳转到别的页面。实现步骤：1、页面...
2021-08-10
Vue3.0 自己实现放大镜效果案例讲解
需要实现的效果是: 固定放大两倍,鼠标进入到左侧图片区域的时候,遮罩层显示,离开时,遮罩层隐藏。 css中的cursorhttps://www.runoob.com/cssref/pr-class-cursor.html&...
2021-08-10
js判断移动端横竖屏视口检测实现的几种方法
目录1、不同视口的获取方法
2、JavaScript检测横竖屏
3、CSS检测横竖屏
4、meta标签属性设置
5、meta标签属性设置设置刘海屏&底部小黑条
1、不同视口的获取方法
// 获取视...
2021-08-10
最全的package.json解析
目录1. 概述
2. name字段
3. version字段
4. description字段
5. keywords字段
6. homepage字段
7. bugs字段
8. license字段
9. author字段 contributors字段
10. files字...
2021-08-10
vue实现点击翻转效果
用vue简单实现一个点击翻转的效果，供大家参考，具体内容如下1、2、3、//html代码 测试 demo命名随便复制来的<div class="Demo"> <div class="Before" :class="isTop...
2021-08-10
关于VUE的编译作用域及slot作用域插槽问题
什么是插槽？插槽的指令为v-slot，它目前取代了slot和slot-scope，插槽内容，vue实例一套内容分发的api，将slot元素作为承载分发内容的出口。插槽分为单个插槽，具名插槽，还有作用域插槽...
2021-08-10
小程序通过小程序云实现微信支付功能实例
目录一、开通微信支付 1.1 关联商户号1.2 添加商户号1.3 管理员授权二、云函数开发2.1 新建云函数2.2 云函数代码2.3 云函数上传并部署三、小程序调用3.1 统一下单3.2 支付...
2021-08-10
webpack文件打包错误异常
在进行webpack打包前我们要确保已完成的工作：1）安装webpack：推荐全局命令 npm install -g webpack 查看webpack版本 webpack -v2）此时对文件进行打包可能出现错误，提示脚手架文件...
2021-08-10
React+TypeScript进行项目构建案例讲解
    react项目构建可以很简单，但是如果是结合typescript，其实也不是很麻烦，官网也有很明确的说明。有两种办法：    1、直接构建带有typescript的react项目，...
2021-08-10
微信小程序实现拼图游戏
本文实例为大家分享了微信小程序实现拼图游戏的具体代码，供大家参考，具体内容如下页面展示项目链接微信小程序实现拼图游戏项目设计首页面wxml<!--index.wxml--><view class="...
2021-08-10
jQuery实现发送验证码控制按钮禁用功能
需求效果：点击发送验证码之后，按钮禁用，5秒之后取消禁用。
效果图如下：点击发送之后禁用按钮5秒之后取消禁用，重新发送代码如下：<!DOCTYPE html><html lang="en"><head> <meta ch...
2021-08-10
小程序实现购物车完整版
小程序实现完整购物车[全选/反选计算金额/加减计算数量跟金额]，供大家参考，具体内容如下一、wxml页面代码模块<view wx:if="{{hasList}}"> <view class="order_list"> <vi...
2021-08-10
JavaScript之事件循环案例讲解
js中的事件循环因为JavaScript是单线程的，同一事件只能执行一种方法，所以会将程序中的方法加入到执行栈中按照后进先出的顺序依次执行，当遇见异步任务时不会被阻塞，而是将任务放...
2021-08-10
Vue3 style CSS 变量注入的实现
目录摘要
基础示例
动机
设计细节
编译细节
采用策略
实践
提示
绑定恰当的属性
注意 style 的更新
参考资料
摘要
在单文件组件样式中支持使用组件状态驱动的 CSS 变量（ CSS...
2021-08-10
Vue如何优雅的清除定时器
目录前言
优化
衍生问题：beforeDestroy 没有触发？
前言
清除定时器，相信有相当一部分人是这么写的：
export default { data() { reurn { timer: null } }, moun...
2021-08-10
Vue实现牌面翻转效果
本文实例为大家分享了Vue实现牌面翻转效果的具体代码，供大家参考，具体内容如下1.实现效果实现一个点击沿中心Y轴翻转的翻转效果。2.方法分前（front）、后(behind)两部分，behind的d...
2021-08-10
JavaScript中let避免闭包造成问题
关于 let 避免闭包带来的问题利用面向对象思想完成买家信息删除功能，每一条信息包含：
姓名
电话
电话号码
省份
实现以下要求：
不能借用任何第三方库，需要使用原生代码...
2021-08-10
vue动态加载本地图片的处理方法
发现问题今天遇到一个在vue文件中引入本地图片的问题，于是有了这篇文章。通常，我们的一个img标签在html中是这么写的：<img src="../images/demo.png">这种写法只能引用相对路径...
2021-08-10
React事件绑定的方式详解
一、是什么在react应用中，事件名都是用小驼峰格式进行书写，例如onclick要改写成onClick最简单的事件绑定如下：class ShowAlert extends React.Component { showAlert() { c...
2021-08-10
Vue3.0 手写放大镜效果
需要实现的效果是: 固定放大两倍,鼠标进入到左侧图片区域的时候,遮罩层显示,离开时,遮罩层隐藏。 css中的cursor 鼠标跟随效果如何实现: (子绝父相)绝对定位 + 修改top,le...
2021-08-10
jQuery实现带展开动画的导航栏效果
设计和自定义一个带展开动画效果的导航栏，尝试写了一个demo，加上设计和调试差不多写了一天吧。
这里就来讲讲如何从设计->写布局->写样式->写JS代码 完成一个完全自己设计的导...
2021-08-10
详解React中组件之间通信的方式
一、是什么我们将组件间通信可以拆分为两个词： 组件 通信回顾Vue系列的文章，组件是vue中最强大的功能之一，同样组件化是React的核心思想相比vue，React的组件更加灵活和多...
2021-08-10
Vue组件实现旋转木马动画
本文实例为大家分享了Vue组件实现旋转木马动画的具体代码，供大家参考，具体内容如下源码如下<template> <div id="wrapper"> <transition-group name="list" tag="ul" mode...
2021-08-10
Vue封装通用table组件的完整步骤记录
目录前言
为什么需要封装table组件？
第一步：定义通用组件
第二步：父组件与子组件进行render通信
第三步：使用组件
总结
前言
随着业务的发展和功能的增多，我们发现不少页面都具备...
2021-08-10
关于React状态管理的三个规则总结
目录前言No.1 一个关注点
No.2 提取复杂的状态逻辑
No.3 提取多个状态操作
总结
前言React 组件内部的状态是在渲染过程之间保持不变的封装数据。useState() 是 React hook，...
2021-08-10
Vue + element实现动态显示后台数据到options的操作方法
需求：实现selector选择器中选项值options 数据的动态显示，而非写死的数据，我的角色ID数据如下：现在实现把这些数据请求显示option上实现如下：使用element-ui中selector 选择器：<el...
2021-08-10
JavaScript平铺数组转树形结构的实现示例
目录后台丢来了1w条数据
递归方式非递归方式总结后台丢来了1w条数据
千算万算，还是没有逃过，后台真的就上万条数据一次丢给前端了。好吧，好在还不是10w条。如下，后台返回的是这...
2021-08-10
JavaScript实现网页版五子棋游戏
本文实例为大家分享了JavaScript实现网页版五子棋游戏的具体代码，供大家参考，具体内容如下学习js的第三天，跟着老师完成的五子棋小游戏，记录学习成果欢迎大佬们一起分享经验，批评...
2021-08-10
js中getBoundingClientRect( )方法案例详解
一.getBoundingClientRect() 解析getBoundingClientRect() 方法返回元素的大小及其相对于视口的位置。语法rectObject = object.getBoundingClientRect();值rectObject.top：...
2021-08-10
JS实现微信"炸屎"大作战功能
大家好，我是秋风，近日，微信又发布了新功能（更新到微信8.0.6）。最火热的非"炸屎"功能莫属了，各种群里纷纷玩起了炸屎的功能。不知道大家是否经历过那样一个时候，小时候（我是说很小的...
2021-08-10
React开启代理的2种实用方式
开启代理的两种方式react并没有封装好了的ajax请求的代码供我们直接使用，在进行交互的时候，我们需要自己封装ajax代码或者使用第三方ajax库，一般我们用axios(轻量级)。先说一下...
2021-08-10
小程序原生实现左滑抽屉菜单
目录WXS 响应事件
方案A
页面结构和样式
WXS 事件回调函数
WXS 脚本
遮罩层
方案B
为什么要使用 WXS
结语 & 参考资料
参考资料：在移动端，侧滑菜单是一个很常用的组件（通常称作...
2021-08-10
vue中keepAlive组件的作用和使用方法详解
前言在面试的时候，很多面试官再问vue的时候可能就会提一嘴，你知道keep-alive有什么作用吗？keep-alive是vue内置的一个组件，而这个组件的作用就是能够缓存不活动的组件，我们能够知...
2021-08-10
H5微信公众号授权的简单实现步骤
前言昨天因为有一个项目上面需要实现h5微信授权工作。所以花了两个小时来完成这个功能。​​开始工作前做的准备流程说明【提前沟通过的流程】 微信授权具有时...
2021-08-10
js实现0ms延时定时器的几种方式
目录queueMicrotask
async/await
MessageChannel
最后
附录
这两天看到一篇介绍《如何实现准时的 setTimeout？》的文章，文章起源于一道面试题：有什么办法让setTimeout准时呀？具...
2021-08-10
Vue插件报错:Vue.js is detected on this page.问题解决
Vue插件报错：Vue.js is detected on this pag下载Vue插件下载地址：https://chrome.pictureknow.com/将下载好的crx文件拖进拓展程序首先去https://www.bilibili.com/ 验...
2021-08-10
JavaScript实现网页版贪吃蛇游戏
本文实例为大家分享了JavaScript实现网页贪吃蛇游戏的具体代码，供大家参考，具体内容如下<!DOCTYPE html><html><head><title>贪吃蛇</title></head><body><canvas id="canvas"...
2021-08-10
