WEB开发
-
Vue3 Vite3 状态管理 pinia 基本使用、持久化、在路由守卫中的使用
在《基于vite创建vue3项目》一文中整合了pinia，有不少伙伴不知道pinia是什么，本文简单介绍pinia。主要包括三方面：pinia的基本用法，在《基于vite创建vue3项目》中demo的基础上简单重构。如何持久化pinia中的数据，保证浏览器刷新时，pinia中的数据不丢失；在vue-
-
记录--有关uni-app如何实现路由拦截的知识分享
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助前言随着业务的需求，项目需要支持H5、各类小程序以及IOS和Android，这就需要涉及到跨端技术，不然每一端都开发一套，人力成本和维护成本太高了。团队的技术栈主要以Vue为主，最终的选型是以uni-app+uview2.0作为跨端技术栈。
-
【前端必会】tapable、hook，webpack的灵魂
背景什么是tapable、hook，平时做vue开发时的webpack配置一直都没弄懂，你也有这种情况吗？还是看源码，闲来无聊又看一下webpack的源码，看看能否找到一些宝藏tapable和webpack没有特定关系，可以先看下这篇文章，了解下这个小型库https://webpack.docsch
-
Vue中EventBus(事件总线)的基本用法
vue组件中最常见的数据传递就是父子组件之间的传递，父组件可以通过props向下传数据给子组件，子组件可以通过$emit事件携带数据给父组件。然而当两个页面没有任关系，该如何通信？这就引出了EventBus(事件总线)这个概念初始化方法一：新建文件首先需要初始化一个EventBus，并且向外共享一个
-
npm 笔记
NPMnpmstandsfor"NodePackageManager"包管理器可以把库，框架作为Nodejs模块引入。package.jsonpackage.json文件是所有Node.js项目和npm包的枢纽，它存储项目的相关信息。它由单个JSON对象组成，并以键值对的形式存储项目信息，且至少包含
-
图片优化
一、常见的图片格式BMP是无损的、既支持索引色也支持直接色的点阵图。这种图片格式几乎没有对数据进行压缩，所以BMP格式的图片通常是较大的文件。GIF是无损的、采用索引色的点阵图。采用LZW压缩算法进行编码。文件小，是GIF格式的优点，同时，GIF格式还具有支持动画以及透明的优点。但是GIF格式仅支持
-
分享一个Vue实现图片水平瀑布流的插件
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助一.需求来源今天碰到了一个需求，需要在页面里，用水平瀑布流的方式，将一些图片进行加载，这让我突然想起我很久以前写的一篇文章《JS两种方式实现水平瀑布流布局》但是有个问题，这个需求是Vue项目的，那没办法，这里给大家分享下我的开发过程，项目主
-
react项目配置Eslint
ReactOrTaro项目配置Eslint校验一、下载Eslint相关deps依赖项；npminstall--save-deveslint-plugin-prettiereslint-plugin-jsx-a11yeslint-config-airbnb注意：由于eslint-config-airb
-
语言基础---变量
语言基础-变量前言从本篇博客开始博主个人认为重要的知识点都会在在行前添加⭐来进行标识变量ECMASCRIPT变量是松散类型，意思是变量可以用于保存任何类型的数据。ECMASCRIPT中有三个关键字可以来声明变量：var、let和const。值得注意的是let和const只能在ES6以及更晚的版本中使
-
【前端必会】走进webpack生命周期，另类的学习方法
背景webpack构建过程中的hooks都有什么呢？除了在网上看一些文章，还可以通过更直接的办法，结合官方文档快速让你进入webpack的hook世界写一个入口文件//index.jsconstwebpack=require("webpack");constpath=require("path");
-
Express.js 笔记
Express在myApp.js文件的前两行中，创建一个Express应用对象很简单。这个对象有几种方法，一个基础的方法是app.listen(port)。它处于运行状态时告诉服务器监听指定的端口。出于测试的原因，需要应用在后台运行，所以在server.js中已经添加了这个方法。在Express中，
-
vue3 自定义指令控制按钮权限
经过1个周的摸索和查阅资料，终于搞定VUE3中自定义指令，实现按钮级别的权限控制。当然，只是简单的对按钮进行隐藏和删除的dom操作比较容易，一直纠结的是当按钮无权限时，不是直接删除当前dom元素（button按钮），这样用户体验不好，让人感觉没有这个功能。为了提高用户体验，当该按钮无权使用时，使用e
-
MongoDB & Mongoose
##MongoDB和Mongoose###mongoose建立一个MongoDBAtlas数据库并导入连接到它所需的软件包。将`mongodb@~3.6.0`和`mongoose@~5.4.0`添加到项目的`package.json`中。然后，在`myApp.js`文件中请求`mongoose`。创
-
节流与防抖
1|0一、节流概念：在规定的间隔时间范围内不会重复触发回调，只有大于这个时间间隔才会触发回调，把频繁触发变为少量触发。类似于技能CD。应用：点击按钮，轮播图点击左右箭头。插件lodash.js，它里面封装了函数的防抖与节流业务。<p>计数器：<span>0</span&
-
Bootstrap5 如何创建多媒体对象
一、在Bootstra5中使用媒体对象Bootstrap媒体对象在版本5中已经停止支持了。但是，我们仍然可以使用flex和margin创建包含左对齐或右对齐媒体对象（如图像或视频）以及文本内容（如博客评论、推文等）的布局。<!doctypehtml><htmllang="zh-CN
-
设置Radio button 和Checkbox 在disabled 状态的样式
有时需要在view页面设置标签的状态为disabled，但是客户反映radiobutton和checkbox的颜色很浅，难以识别，尤其是打印后，如下： 可以使用下面的css更改原有的样式input[type="radio"]:checked:disabled{?12
-
CDN
1|0一、CDN的概念概念：CDN（ContentDeliveryNetwork）是指一种通过互联网互相连接的电脑网络系统，利用最靠近每位用户的服务器，更快、更可靠地将音乐、图片、视频、应用程序及其他文件发送给用户，来提供高性能、可扩展性及低成本的网络内容传递给用户。即内容分发网络。2|0二、CDN
-
JS面试必学
ES6部分Typescript部分前端工程面经（节流防抖、https、前端攻击、性能优化...）https://juejin.cn/post/6844903734464495623ES6面试（点击可展开）为什么选择ES6？ES6是新一代的JS语言标准，规范了JS的使用标准（var标量提升）、新增了J
-
独辟蹊径：逆推Krpano切图算法，实现在浏览器切多层级瓦片图
前言趁着隔离梳理一下之前做的一个有用的功能：在浏览器中去切割多分辨率瓦片图这是一个有趣的过程，跟我一起探索吧阅读本文需具备前置知识：对krpano有所了解，如：使用krpano去开发全景本着故弄玄虚的原则，最精彩的会放到最后揭晓，由浅入深，层层递进！1.功能简介减轻服务器压力，krpano切图比较消
-
HTML 中的 JavaScript
HTML中的JavaScript前言在上一篇文章"什么是JavaScript？"中我们说到js作为一门和页面交互的语言。那如何把网页的主导语言HTML和JavaScript关联起来呢？在js早期，网景公司创造出了<script>元素，用来讲JavaScript插入到HTML中。<s
-
JS 模块化- 05 ES Module & 4 大规范总结
1ESModule规范ESModule是目前使用较多的模块化规范，在Vue、React中大量使用，大家应该非常熟悉。TypeScript中的模块化与ES类似。1.1导出模块导出模块有两种方式：按需导出和默认导出。按需导出是使用export关键字，将需要导出的成员（变量、函数、对象等）依次导出：exp
-
Pjax 下动态加载插件方案
在纯静态网站里，有时候会动态更新某个区域往会选择Pjax（swup、barba.js）去处理，他们都是使用ajax和pushState通过真正的永久链接，页面标题和后退按钮提供快速浏览体验。但是实际使用中可能会遇到不同页面可能会需要加载不同插件处理，有些人可能会全量选择加载，这样会导致加载很多无用的
-
Java Script 原型链原理与继承
所有对象都有隐式原型；原型也是对象，也有隐式原型.functionUser(){}console.log(User.prototype);functionUser(){}varu=newUser();console.log(u.hasOwnProperty);Object.prototype.has
-
Vue实现拖拽穿梭框功能四种方式
一、使用原生js实现拖拽点击打开视频讲解更加详细<htmllang="en"><head><metacharset="UTF-8"/><title>Lazyload</title><style>.drag{background-
