JavaScript - 教程之家

87浏览

0评论

js与css的阻塞问题详析

目录DOMContentLoaded和load
js 阻塞了什么
css 阻塞了什么
优化总结DOMContentLoaded和load
我们先了解两个事件，有助于后面的分析。load事件：load 应该仅用于检测一个完全加...

2021-08-10

77浏览

0评论

iOS微信H5页面橡皮回弹效果的踩坑记录

业务需求
近期开发的项目有一部分是与微信公众号相关的H5页面，在Android端微信上页面效果展示无异常，但是在 iOS端微信多多少少会出现一些意想不到的bug。此次主要针对移动端...

2021-08-10

66浏览

0评论

vue中正确使用jsx语法的姿势分享

目录前言
虚拟DOM
什么是虚拟DOM
虚拟DOM的优点渲染函数是什么
jsx
在vue3中编写jsx的两种方式
用法最后
参考前言
又到了愉快的摸鱼时间,我觉得不能荒废,H5页面我一直用的v...

2021-08-10

63浏览

0评论

Node.js+express+socket实现在线实时多人聊天室

本文实例为大家分享了Node.js+express+socket实现在线实时多人聊天室的具体代码，供大家参考，具体内容如下文件结构如下：前端部分：登录页面Login部分：login.html<!DOCTYPE html>...

2021-08-10

70浏览

0评论

微信小程序实现简单聊天室

本文实例为大家分享了微信小程序实现简单聊天室的具体代码，供大家参考，具体内容如下cha.js// pages/chat/chat.js// 获取小程序实例let app = getApp();Page({ /** * 页面...

2021-08-10

82浏览

0评论

微信小程序webView嵌入H5的方法实例

前言微信小程序提供了新的开放能力！它终于开放了在小程序中内嵌HTML页面的功能！从微信小程序基础库1.6.4开始，我们就可以在小程序内放置一个<web-view>组件来链接我们的HTML页...

2021-08-10

56浏览

0评论

Vue 页面监听用户预览时间功能的实现代码

最近的业务中涉及到这样一个需求，在线培训的系统需要知道用户对某个在线预览的页面追踪用户的预览时长。初步我们首先想到借助 Vue 页面的生命周期函数 mounted 和 destroyed...

2021-08-10

72浏览

0评论

ES6扩展运算符的使用方法示例

目录什么是spread 和rest运算符
数组的扩展运算符
rest运算符（收集作用）
spread运算符（展开作用）
对象的扩张运算符
浅克隆
深克隆
总结什么是spread 和rest运算符
spread和rest...

2021-08-10

80浏览

0评论

JavaScript中new操作符的原理示例详解

new的用处new的作用是通过构造函数来创建一个实例对象，该实例与原型和构造函数之间的关系如下图所示：先来总结一下创建一个空对象空对象的内部属性 __proto__ 赋值为...

2021-08-10

75浏览

0评论

JavaScript中的AOP编程的基本实现

AOP 简介AOP(面向切面编程)的主要作用是把一些跟核心业务逻辑模块无关的功能抽离出来，这些跟业务逻辑无关的功能通常包括日志统计、安全控制、异常处理等。把这些功能抽离出...

2021-08-10

500浏览

0评论

vue 集成腾讯地图实现api(附DEMO)

目录写作背景项目说明前期准备工作
注意点写作背景.之前项目使用腾讯地图，感觉还是比较好用的，但是官方的demo大部分都是原生js，且比较基础，并且很多高级Api分布比较分散，不利于...

2021-08-10

56浏览

0评论

基于Vue实现自定义组件的方式引入图标

前言在项目开发中，使用图标的方式有很多种，可以在iconfont上面找到合适的图标，通过http或者直接下载使用，这里我分享一种通过实现自定义组件的方式引入图标。搭建环境
这里通过@...

2021-08-10

78浏览

0评论

Next.js入门使用教程

目录简介创建Next.js项目
手动创建Next.js项目creact-next-app快速创建项目
Pages
路由
Link
Router
参数传递与接收
动态路由
钩子事件
获取数据
getStaticProps
构建时请...

2021-08-10

71浏览

0评论

React中refs的一些常见用法汇总

目录什么是Refs
一、String 类型的 Refs
二、回调 Refs三、React.createRef()四、useRef五、Refs 与函数组件总结什么是Refs
Refs 提供了一种方式，允许我们访问 DOM 节点或在...

2021-08-10

57浏览

0评论

Vue登录页面的动态粒子背景插件实现

目录动态粒子效果如下：
安装插件动态粒子效果如下：
安装插件npm install vue-particles --save-dev在main.js文件中全局引入import VueParticles from 'vue-particles' Vue.u...

2021-08-10

64浏览

0评论

React实现导入导出Excel文件

目录表示层
业务层
核心插件xlsx
excel 导入
excel 导出
excel 导出插件（js-export-excel）
实现效果结语
表示层
这里我是使用的是antd的Upload上传组件
引用antd部分代码
imp...

2021-08-10

94浏览

0评论

Vite创建项目的实现步骤

目录前言
yarn create 做了什么
源码解析
项目依赖
模版配置
工具函数
copy
copyDir
emptyDir
核心函数
命令行交互并创建文件夹
写入文件
小结
前言
随着 Vite2 的发布并日...

2021-08-10

66浏览

0评论

如何利用Javascript生成平滑曲线详解

目录前言贝塞尔曲线简介二次贝塞尔曲线三次贝塞尔曲线贝塞尔曲线计算函数拟合算法附录：Vector2D相关的代码总结前言平滑曲线生成是一个很实用的技术很多时候，我们都需要通过绘...

2021-08-10

78浏览

0评论

Vue 路由返回恢复页面状态的操作方法

路由参数、路由导航守卫：页面后退返回时，保留搜索结果需求场景：首页搜索内容，点击跳转至详情页，页面后退返回主页，保留搜索结果。方案：路由参数；路由守卫需求描述在使用 Vue 开发前...

2021-08-10

73浏览

0评论

vue实现四级导航及验证码的方法实例

实现效果: 首先创建五个vue界面1.home.vue页面<template> <div id="home-wrapper"> <h1>{{ name }}</h1> <nav> ...

2021-08-10

73浏览

0评论

JS防抖节流函数的实现与使用场景

目录一、什么是函数防抖
1、为什么需要函数防抖？
2、函数防抖的要点3、函数防抖的实现
4、函数防抖的使用场景
二、什么是函数节流
1、函数节流的要点
2、函数节流的实现3、...

2021-08-10

77浏览

0评论

webpack-dev-server搭建本地服务器的实现

目录前言
webpack-deb-server
webpack-dev-server启动报错
解决方案1
解决方案2
解决端口占用问题
前言
当我们使用webpack打包时，发现每次更新了一点代码，都需要重新打包，这样...

2021-08-10

59浏览

0评论

利用原生js模拟直播弹幕滚动效果

目录1、基本原理
2、具体代码
总结
1、基本原理
首先将直播区域分成十份（我个人自己为了便于计算分成十份），将输入的内容随机放到分成的十份区域中，插入到十份区域右边的视图之...

2021-08-10

120浏览

0评论

node+socket实现简易聊天室功能

本文实例为大家分享了node+socket实现简易聊天室的具体代码，供大家参考，具体内容如下服务端const net = require('net')const server = net.createServer()//用户列表let cli...

2021-08-10

55浏览

0评论

vue验证码组件使用方法详解

本文实例为大家分享了vue验证码组件使用的具体实现代码，供大家参考，具体内容如下代码如下：<template> <div class="join_formitem"> <label class="enquiry">验证码<...

2021-08-10

297浏览

0评论

面试最常问的13种Vue修饰符

目录1.lazy
2.trim
3.number
4.stop
5.capture
6.self
7.once
8.prevent
9.native
10.left，right，middle
11.passive
12.camel
12.sync
13.keyCode
1.lazy
lazy修饰符作用是，改...

2021-08-10

78浏览

0评论

一篇文章快速了解Angular和Ionic生命周期和钩子函数

目录Angular
实现
调用顺序注意Ionic
ionic是怎么处理页面的生命周期的
路由守卫
总结Angular
实现
首先实现方式不用多说，使用钩子函数需要在定义的时候实现对应的接口expor...

2021-08-10

79浏览

0评论

利用JavaScript差集实现一个对比小工具

前言在工作中需要每周统计人员提交材料情况又不想一个一个复制黏贴查找只好写一个小工具帮自己查找谁没提交材料先把页面搞一搞<!DOCTYPE html><html lang="en"><head> <me...

2021-08-10

72浏览

0评论

JavaScript常用数组去重实战源码

数组去重，一般都是在面试的时候才会碰到，一般是要求手写数组去重方法的代码。如果是被提问到，数组去重的方法有哪些？你能答出其中的10种，面试官很有可能对你刮目相看。
在真实的...

2021-08-10

62浏览

0评论

JS对象数组去重的3种方法示例及对比

目录一.去重前后数据对比二.使用方法1.使用filter和Map2.使用reduce3.使用for循环三.2400条数据，三种方法处理时间对比总结一.去重前后数据对比// 原数据是这样的...

2021-08-10

67浏览

0评论

Vue之全局水印的实现示例

目录1.创建水印Js文件
2.引入操作
2.1 在App.vue中引用或其他页面
2.2 在router配置文件中引用【需求】系统内页面显示水印，登录页面没有水印（退出登录时，登录页面不会显示水印...

2021-08-10

115浏览

0评论

利用js实现Vue2.0中数据的双向绑定功能

Object.defineProperty了解
语法：Object.defineProperty(obj, prop, descriptor) obj 要定义属性的对象。 prop 要定义或修改的属性的名称 descriptor 要定义或修...

2021-08-10

60浏览

0评论

微信小程序实现计算器小功能

微信小程序现在越来越火爆了，我也看到很多在校大学生都在自学了，那些专门从事APP开发，网页开发的工作者更是看到了小程序的前景，在小程序领域也掺上一脚，本人也是自学小程序的，初...

2021-08-10

60浏览

0评论

Element Plus实现Affix 固钉

目录一、组件介绍
二、源码分析
2.1 template
2.2 script
2.3 实现总结：一、组件介绍
Affix组件用于将页面元素固定在特定可视区域。
1.1 属性 position：指定固钉的位置，可...

2021-08-10

61浏览

0评论

微信小程序实现计算器案例

本文实例为大家分享了微信小程序实现计算器的具体代码，供大家参考，具体内容如下项目展示页面设计分为上面输入的显示部分和下面按键部分<view c...

2021-08-10

64浏览

0评论

vue-route路由管理的安装与配置方法

介绍Vue Router 是 Vue.js官方的路由管理器。它和 Vue.js 的核心深度集成，让构建单页面应用变得易如反掌。包含的功能有：嵌套的路由/视图表模块化的、基于组件的路由...

2021-08-10

69浏览

0评论

微信小程序页面返回传值的4种解决方案汇总

目录使用场景
解决方案
1、使用globalData实现2、使用本地缓存Storage实现3、使用小程序的Page页面栈实现4、使用wx.navigateTo API的events实现总结
使用场景
小程序从A页...

2021-08-10

59浏览

0评论

React中Portals与错误边界处理实现

目录Portals
错误边界处理
如果没有使用错误边界会怎样？
注意点
Portals
可以说是插槽，但不同于 Vue 中的 slot，它指的是将一个 React 元素渲染到指定的容器 (真实 DOM) 中...

2021-08-10

63浏览

0评论

JavaScript defineProperty如何实现属性劫持

目录前言描述符
细说get 和 set劫持对象的某个属性
劫持对象的所有属性
劫持对象的所有属性 - 包括对象类型的属性值
defineProperty的缺陷defineProperty还可以挂载属性
de...

2021-08-10

55浏览

0评论

小程序实现简单的计算器

本文实例为大家分享了小程序实现简单计算器的具体代码，供大家参考，具体内容如下#app.json{ "pages": [ "pages/index/index", "pages/logs/logs" ], "window": {...

2021-08-10

75浏览

0评论

微信小程序实现计算器功能

本文实例为大家分享了微信小程序实现计算器功能的具体代码，供大家参考，具体内容如下一、微信小程序开发工具界面二、目录结构第一次进到页面它的目录结构如下：三、需要注意的问...

2021-08-10

60浏览

0评论

用微信小程序实现计算器功能

本文是用微信小程序写的一个简单的计算器，有兴趣的小伙伴可以了解一下。页面部分<view class='box'> <view class='txt'>{{screenNum}}</view> <view capture-bind:t...

2021-08-10

63浏览

0评论

Vue-Jest 自动化测试基础配置详解

目录安装
配置
常见错误测试前的工作
处理依赖
生成实例和 DOM
总结
引用
目前开发大型应用，测试是一个非常重要的环节，而在 Vue 项目中做单元测试可以用 Jest，Jest 是 faceboo...

2021-08-10

74浏览

0评论

vue实现可改变购物数量的购物车

本文实例为大家分享了vue实现改变购物数量的购物车，供大家参考，具体内容如下效果图：知识点：1.computed 计算属性
2.filters 过滤器实现代码：<!DOCTYPE html><html lang="en"><hea...

2021-08-10

78浏览

0评论

微信小程序wxs日期时间处理的实现示例

目录1、时间戳转日期
2、UTC转北京时间
WXS（WeiXin Script）是小程序的一套脚本语言，wxs 与 javascript 是不同的语言，有自己的语法，并不和 javascript 一致。其中包括了很多日常...

2021-08-10

83浏览

0评论

微信小程序虚拟列表的实现示例

目录前言
分析初始渲染方法
初步优化
进一步优化
方法二
前言
大部分小程序都会有这样的需求，页面有长列表，需要下拉到底时请求后台数据，一直渲染数据，当数据列表长时，会发现明显...

2021-08-10

49浏览

0评论

Vue 级联下拉框的设计与实现

目录1.数据库设计2.前端页面3.一个完整的demo 在前端开发中，级联选择框是经常用到的，这样不仅可以增加用户输入的友好性，还能减少前后端交互的数据量。本文以elementUI...

2021-08-10

83浏览

0评论

微信小程序实现锚点定位功能的方法实例

前言在小程序开发中，我们经常会遇到滚动列表查看的需求，那么使用锚点定位来实现可以达到交互体验更加友好的效果，我们看下项目中实现的效果：功能实现
采用小程序视...

2021-08-10

56浏览

0评论

JavaScript如何监测数组的变化

前言之前介绍defineProperty的时候说到，其只能监测对象的变化，并不能监测数组的变化。本文致力于说清楚怎么实现监测数组的变化。核心思路：找到改变原数组的方法，然后对这些方法...

2021-08-10

53浏览

0评论

小程序实现计算器功能

本文实例为大家分享了小程序实现计算器功能的具体代码，供大家参考，具体内容如下实现模拟手机上的计算器，输入即可运算本页面是做一个计算收款的页面，如果不需要下面的内容可以删...

2021-08-10

热门文章