网站建设

前端面试JavaScript高频手写大全

目录 1. 手写instanceof 2. 实现数组的map方法 3. reduce实现数组的map方法 4. 手写数组的reduce方法 5. 数组扁平化 5. 1 es6提供的新方法 flat(depth) 5.2 利用cancat 6. 函数柯里化 7. 浅拷贝和深拷贝的实...

微信小程序实现瀑布流分页滚动加载

本文实例为大家分享了微信小程序实现瀑布流分页滚动加载的具体代码,供大家参考,具体内容如下 两种分页方式 普通的分页效果会在页面底部提供点击下一页和上一页的按钮,在点...

前端JavaScript彻底弄懂函数柯里化curry

目录 一、什么是柯里化( curry) 二、柯里化的用途 三、如何封装柯里化工具函数 一、什么是柯里化( curry) 在数学和计算机科学中,柯里化是一种将使用多个参数的一个函数转换成...

vue项目中less的一些使用小技巧

目录 前言 一、样式穿透 1. 什么是样式穿透? 2. 如何使用? 二、混入 1. 什么是混入? 2. 如何使用? 三、 less自动化导入 1. 自动化导入好处 2. 如何实现? 总结 前言 我们所能看到的美...

如何为老vue项目添加vite支持详解

1、前言 接手公司的某个项目已经两年了,现在每次启动项目都接近1分钟,hmr也要好几秒的时间,but vite2发布之后就看到了曙光,但是一直没有动手进行升级,昨天终于忍不住了,升级...

vue3 文档梳理快速入门

目录 一、setup 1. setup 函数中的第一个参数 —— props 2. contextcontext 二、setup 函数的返回值 1.setup 函数的返回值 —— 对象 三、响应式系统 API 1. reactive 2. ref 3. computed 4. readonly 5. watchEffe...

五分钟教你使用vue-cli3创建项目(新手入门)

目录 一、搭建vue环境 二、Vue脚手架工具 三、创建项目 四、选择manually select (enter键确认,并进入下一步) 五、选择完成之后回车 这里我们选择3.x的 六、完成之后回车 出现以下界面 七、...

关于Vue代码可读性的几点建议

目录 一、善用组件让代码更有条理性 1、 提取UI组件 2、按模块提取业务组件 3、按功能提取功能组件 二、利用v-bind使组件的属性更具有可读性 三、利用attrs与attrs与listeners来封装第三方...

js实现瀑布流触底动态加载数据

本文实例为大家分享了js实现瀑布流触底动态加载数据的具体代码,供大家参考,具体内容如下 // onScrollEvent 滚动条事件div class="box" ref="box" @mousewheel="onScrollEvent" //每一个方块内的内容...

原生JS实现悬停下拉菜单

JS实现悬停下拉菜单,这个是前端面试中遇到的场景题,原理就是修改菜单样式的display属性的属性值从none=block,具体实现见下,重点关注下面几个部分。 给每个section设置浮动。 将可继...

原生js实现下拉菜单

下拉菜单在实际生活中也挺常见的,它实现的j香港大带宽服务器http://www.558idc.com/st.htmls代码与tab选卡,手风琴几乎一样,在此不过多赘述。 我仿照苏宁易购官网写了一个下拉菜单,实...

原生js实现手风琴效果

在实际网页开发中,手风琴出现频率也居高。 简单地做了一个手风琴,但觉得它的过渡效果没实现,内容列表出现得很突兀,效果图如下: 实现代码如下: !DOCTYPE htmlhtml lang="en"head m...

javascript实现鼠标拖尾特效

鼠标特效需要使用定时器setTimeout在固定时间生成节点,删除节点,生成的节点赋予随机的宽高,随机颜色,使每个特效节点都看起来不一样 注意:生成的节点需要设置绝对定位,使其...

用js实现简单的tab选项卡

tab选卡 现实网页的使用频率极高,基本上每个网页都需要使用一个或多个tab选卡 我们可以用js实现简单的tab选卡效果 代码如下: !DOCTYPE htmlhtml lang="en"head meta charset="UTF-8" meta name="viewp...

Vue3结合TypeScript项目开发实践总结

目录 概述 1、compositon Api 1、ref 和 reactive的区别? 2、周期函数 3、store使用 4、router的使用 2、关注点分离 3、TypeScript支持 概述 Vue3出来已经有一段时间了,在团队中,也进行了大量的业...

OpenLayers实现点要素图层的聚合显示的方法

目录 1、前言 2、点要素图层的聚合 3、聚合特殊处理一 4、聚合特殊处理二 5.、结语 1、前言 在很多情况下,点要素图层中的要素数量可能会成百上千,这时候如果不做任何处理直接加...

JavaScript 运行机制详解再浅谈Event Loop

目录 一、为什么JavaScript是单线程? 二、任务队列 三、事件和回调函数 四、Event Loop 五、定时器 六、Node.js的Event Loop 一、为什么JavaScript是单线程? JavaScript 语言的一大特点就是单线程...

element动态路由面包屑的实现示例

要掌握:localStorage,组件封装 emm,第一次上传视频转gif的图片,效果不咋好。。。 视频转gif 的软件连接 https://www.jb51.net/softs/723131.html 在 components 下新建一个 curmbs 文件夹,并在该文件...

Vue3结合TypeScript项目开发实战记录

目录 概述 1、compositon Api 1、ref 和 reactive的区别? 2、周期函数 3、store使用 4、router的使用 2、关注点分离 3、TypeScript支持 总结 概述 Vue3出来已经有一段时间了,在团队中,也进行了大量...

Vue-router不允许导航到当前位置(/path)错误原因以及

目录 报错提示 错误原因 错误演示 解决方法 方法一 方法二 方法三 报错提示 Navigating to current location ("/path") is not allowed 错误原因 控制台出现以上这种 Navigating to current location ("/path")...

vue实现百分比占比条效果

本文实例为大家分享了vue实现百分比占比条的具体代码,供大家参考,具体内容如下 效果图 1.各自占比 /p 2.左百分百 3.右百分百 代码实现 template div class="about" !-- h1This is an about page/h1...

Vue实现动态圆环百分比进度条

最近在开发小程序的时候,碰到一个实现圆环百分比进度条的需求,类似如下设计图: 小白的我感觉实现起来有难度,于是上百度看看别人是怎么做的,结果没找到一个满意的,要不是...

JS中可能会常用到的一些数据处理方法

目录 DOM处理 数组 方法 总结 DOM处理 DOM 为文档提供了结构化表示,并定义了如何通过脚本来访问文档结构。目的其实就是为了能让js操作html元素而制定的一个规范。DOM就是由节点组成的...

vue实现动态进度条效果

本文实例为大家分享了vue实现动态进度条效果的具体代码,供大家参考,具体内容如下 演示效果: 结构 progress/index.js const controller = { init: require('./controllers/html'), speed: require('./controll...

jquery实现员工信息添加与删除功能

本文实例为大家分享了jquery实现员工信息添加与删除功能的具体代码,供大家参考,具体内容如下 员工表格添加用了jquery事件 主要按钮绑定事件 !DOCTYPE htmlhtml lang="cn"head meta charset="UT...

Javascript基础知识中关于内置对象的知识

目录 1、内置对象介绍 1.1 Math对象 1.2 Math中的方法 1.3 Date对象 2、Date中的方法 3、经典案例:倒计时效果: 4、Array数组对象 4.1 数组的创建 4.2 数组中的常用方法 5、字符串String 1、内置对...

antd+vue实现动态验证循环属性表单的思路

希望实现查询表单的某些属性可以循环验证必填项: 需求: 1.名称,对比项,备注必填,默认为一行,可增加多行 2.根据名称,动态请求对比项列表,名称变化时,清空该行当前选择的...

使用js实现瀑布流效果

本文实例为大家分享了js实现瀑布流效果的具体代码,供大家参考,具体内容如下 源码: !DOCTYPE htmlhtml lang="en"head meta charset="UTF-8" meta http-equiv="X-UA-Compatible" content="IE=edge" meta name="viewpo...

JS实现图片瀑布流效果

本文实例为大家分享了JS实现图片瀑布流的具体代码,供大家参考,具体内容如下 过程: 1、创建一个放所有图片的模块bigblock。 2、获取这个大模块,追加一个子元素块来放小图。 3、...

js实现web留言板功能

本文实例为大家分享了js实现web留言板的具体代码,供大家参考,具体内容如下 1.画一个标题栏和一个内容栏,提交按钮,留言板 心情:br/ input type="text" id="mood"/br/笔记:br/ textarea id="net...

js实现图片淡入淡出效果

本文实例为大家分享了js实现图片淡入淡出的具体代码,供大家参考,具体内容如下 分析过程: 1.给最大父元素里添加多张图片,让第一张图片的透明度为1 opacity: 1 其余图片的透明度为...

React项目中应用TypeScript的实现

目录 一、前言 二、使用方式 无状态组件 有状态组件 受控组件 三、总结 一、前言 单独的使用typescript 并不会导致学习成本很高,但是绝大部分前端开发者的项目都是依赖于框架的 例...

JavaScript实现经典贪吃蛇游戏

本文实例为大家分享了JavaScript实现经典贪吃蛇游戏的具体代码,供大家参考,具体内容如下 主要使用单例模式,所有元素动态创建; 1.创建地图 var Map; function map(){ this.mapp=null; this.ma...

用JS编写选项卡效果

本文实例为大家分享了JS编写选项卡效果的具体代码,供大家参考,具体内容如下 !DOCTYPE htmlhtmlhead lang="en" meta charset="UTF-8" title/title style *{ padding:0; margin:0; } .selectka { width:500px; height:400...

vue3 与 vue2 优点对比汇总

目录 优点1:diff算法的优化 优点2:hoistStatic 静态提升 优点3:cacheHandlers 事件侦听器缓存 优点4:ssr渲染 优点5:更好的Ts支持 优点6:Compostion API: 组合API/注入API 优点7:更先进的组件...

js对象实现数据分页效果

本文实例为大家分享了js对象实现数据分页效果的具体代码,供大家参考,具体内容如下 实现数据分页要清楚这个的方面的设计: 1.先模拟建立一个 后台数据库 ,如下: var peoson=[ {...

JS版图片放大镜效果

本文实例为大家分享了JS实现图片放大镜效果的具体代码,供大家参考,具体内容如下 !DOCTYPE htmlhtmlhead lang="en" meta charset="UTF-8" title/title style *{ padding:0; margin:0; } .box{ position: relative; wid...

vue中wangEditor的使用及回显数据获取焦点的方法

在做后台管理项目时常常会用到富文本编辑器,在这里推荐大家使用 wangEditor ,非常好用 第一步安装 npm i wangeditor --save 第二步在项目中使用 html 页面中的编辑、添加布局在最下面 div...

js版实现计算器功能

本文实例为大家分享了js实现计算器功能的具体代码,供大家参考,具体内容如下 在老师的带领下完成了这个简单的计算器,这是一个神奇的过程,计算器的基本功能都是有的。虽然是...

react+axios实现github搜索用户功能(示例代码)

加载 请求成功 请求失败 在文件路径点击cmd 回车 首先把服务器打开 npm start app.js import React, { Component } from 'react'import "./App.css"import Header from './conompents/Header'import List from './conompents/List...

深入浅出探究JavaScript中的async与await

目录 1、前言 2、详解 2.1、async 2.1.1、函数返回非Promise对象 2.1.2、函数返回Promise对象 2.2、await 2.3、async、await结合使用 2.4、async、await异常处理 3、总结 1、前言 async函数,也就是我们常...

vue+element实现下拉菜单并带本地搜索功能示例详解

需求: 后台返回数组对像,前端组合成数组,根据name组合成一个个数组并把后台返回的值当成一个children推入数组,在数组中自定义属性备份数据防止搜索的时候改变原数组使得数组无法回...

关于怎么在vue项目里写react详情

我们可以直接创建jsx/tsx文件 这次的项目结构是这样的: 在vue文件里这么使用 // index.vuetemplate div class="wrapper" Common :opt="list" / /div/template script lang="ts"import { Component, Vue } from "vue-property-...

八种vue实现组建通信的方式

目录 一、组件通信 1、props 父组件---子组件通信 2、$emit 子组件---父组件传递 3、bus(事件总线) 兄弟组件通信 4、$parent、$children 直接访问组件实例 5、$refs 6、provide/inject(提供/注入) 多组...

浅谈vue 移动端完美适配方案

前言:根据最近做的一个医疗手机端项目总结在移动端,vue怎么在不同屏幕上做根据不同屏幕大小适配 1、适配方案 在本项目中我所使用的vue移动方案是使用amfe-flexible 和 postcss-pxtorem...

vue面包屑组件的封装方法

vue中自己封装面包屑组件,供大家参考,具体内容如下 要实现效果 前言 很多电商类产品都需要实现面包屑导航,用来优化用户体验 一、初级面包屑封装组件 1.封装基础结构组件 Brea...

vue实现树形表格

本文实例为大家分享了vue实现树形表格的具体代码,,供大家参考,具体内容如下 效果如下: 居中的图片: 代码如下: template div class="treeTable" table tr th设备类型/th th产品名称/th th版本...

React的组件协同使用实现方式

目录 嵌套 父子组件通信 兄弟组件通信 抽离 Mixin React的LinkedStateMixin Reference: 开发人员不用太过于关注UI层面的实现细节,考虑最多的也就是组件与组件之间的数据通信了。那么,在...

带你理解vue中的v-bind

目录 一、v-bind关键源码分析 1、v-bind化的属性统一存储在哪里:attrsMap与attrsList 2、解析HTML,解析出属性集合attrs,在start回调中返回 3、在start回调中创建ASTElement,createASTElement(... ,att...

uni-app实现NFC读取功能

本文实例为大家分享了uni-app实现NFC读取功能的具体代码,供大家参考,具体内容如下 好久没有写博客了,今天难得有空重新记录自己学习的点点滴滴。 1、NFC方法.js // 包路径const pack...