- 博客(44)
- 资源 (1)
- 问答 (1)
- 收藏
- 关注
RSS订阅
原创 React、React Router、JSX 简单入门快速上手
ReactJS 是一种由Facebook开发的JavaScript库，旨在提供一种高效、灵活的方式来构建用户界面
2024-01-30 17:43:21
1126
原创 最简单的Vuejs基础，小伙伴们快来看！！！
Vue.js（读音 /vjuː/, 类似于 view）是一个构建数据驱动的 web 界面的渐进式框架。他的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。只关注视图层，它不仅易于上手，还便于与第三方库或项目整合。...
2020-12-27 17:40:52
3572
11
原创 浏览器画中画？还有谁！！！
Document Picture-in-Picture API（文档画中画API）可以打开一个始终在顶部的窗口，该窗口可以填充任意HTML内容，它扩展了早期的 画中画API，专门支持将HTML 元素放入始终在顶部的窗口中。
2024-04-03 18:18:12
698
1
原创 git 如何删除新已push的代码
在日常的开发中，我们经常使用Git来进行版本控制。有时候，我们可能会不小心将错误的代码 Push 到远程仓库，可以通过此命令重置不留痕迹
2024-01-30 15:59:26
283
原创 vite生产环境报错 TypeError: Failed to fetch dynamically imported module: xxx
vue3 + vite项目，有时跳转页面会卡住
2024-01-26 10:25:27
407
原创 VueUse、View Transitions API实现暗黑模式主题动画切换效果
简单使用VueUse、View Transitions API进行的动画操作，复制粘贴即可
2023-11-08 11:58:27
858
5
原创 Vue中使用Echarts封装为公用组件（简单复制粘贴）
针对一个基于 JavaScript 的开源可视化图表库（Echarts）的简单组件封装，复制粘贴，快速上手使用
2023-10-10 11:07:34
223
原创 Vue3中快速简单使用CKEditor 5富文本编辑器
CKEditor 5就是内嵌在网页中的一个富文本编辑器工具接下来带你快速熟悉CKEditor 5在Vue3中简单使用
2023-09-08 17:03:03
4180
33
原创 CSS权重以及优先级的关系
所谓CSS优先级，即是指CSS样式在浏览器中被解析的先后顺序；浏览器是通过优先级来判断哪些CSS样式应用到该元素上的。优先级就是分配给指定的CSS声明的一个权重，它由匹配的选择器中的每一种选择器类型的数值决定。CSS权重指的是CSS选择器的优先级，优先级高的CSS样式会覆盖优先级底的CSS样式，优先级越高说明权重越高
2023-09-04 11:00:40
84
2
原创 GitHub添加SSH（Windows版 简单易懂）
使用 SSH 协议可以连接远程服务器和服务并向它们验证。 利用 SSH 密钥可以连接到 GitHub，而无需在每次访问时都提供用户名和 personal access token。还可以使用 SSH 密钥对提交进行签名
2023-07-20 11:04:23
1107
转载 我终于搞懂了async/await、promise和setTimeout的执行顺序
javascript是一门单线程语言，在最新的HTML5中提出了Web-Worker，但javascript是单线程这一核心仍未改变。所以一切javascript版的"多线程"都是用单线程模拟出来的，一切javascript多线程都是纸老虎！
2023-03-16 17:39:01
245
原创 Vue源码解析—new Vue()响应性数据劫持
在 new Vue() 之后。 Vue 会调用 _init 函数进行初始化，也就是这里的 init 过程，它会初始化生命周期、事件、 props、 methods、 data、 computed 与 watch 等。其中最重要的是通过 Object.defineProperty 设置 setter 与 getter 函数，用来实现「响应式」以及「依赖收集」，后面会详细讲到，这里只要有一个印象即可。
2023-03-14 16:47:56
96
原创 当你踏进Pinia的时候你就会感觉——发现了新大陆
Pinia 是 Vue 的存储库，它允许您跨组件/页面共享状态。从上面官网的解释不难看出，Pinia和Vuex的作用是一样的，它也充当的是一个存储数据的作用，存储在pinia的数据允许我们在各个组件中使用。...
2022-08-15 10:41:32
305
1
原创 CSS 居然有比Flex更强大的布局？——Grid网格布局
Flex布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局，Grid 布局则是将容器划分成“行"和“列”，产生单元格，然后指定"项目所在”的单元格，可以看作是二维布局，Grid布局远比 Flex布局强大。...
2022-07-11 11:08:15
1339
原创 TypeScript手把手教程，简单易懂
TypeScript （简称 ts）是 JavaScript 的一个超集，主要提供了类型系统和对 ES6 的支持，它由 Microsoft 开发超集：也就是说 typescript有javascript没有的功能用来增强javascript
2022-06-27 10:54:09
1087
原创 Vue移动端基于vw适配方案（简单）移动端相关术语解析（易懂）
Vue移动端基于vw适配方案（简单，复制粘贴即可）移动端相关术语解析（易懂，易于了解）
2022-04-14 17:32:52
2050
1
原创 简单易懂的微前端开发之qiankun快速体验
简单易懂的微前端开发之qiankun快速体验微前端问题SingleSPAqiankun快速体验准备开发基座修改子应用一修改子应用二修改运行结果可能会遇到的问题微前端微前端就是 将不同的功能按照不同的维度拆分成多个子应用。通过主应用来去加载这些子应用。（就是将一个项目中每个大模块分为几个小的应用，并且每个应用都能独立运行，然后整合到一起）微前端的核心在于拆，拆完后在合！当前比较完整的微前端体系 Single-SPA 和 quankun两者总结：子应用可以独立构建，运行时动态加载，主子应用完全解耦，技
2022-02-17 17:49:36
961
1
原创 git基础操作理解（一个连大爷都能看得懂的文章）
git基础操作理解git简介git安装（windows）git初次运行前的配置git基础获取 Git 仓库git本地仓库文件状态提交本地仓库远程仓库的使用git打标签其他相关常用命令git分支分支简介分支创建分支切换分支合并其他相关常用命令仔细阅读文字，肯定能使你受益匪浅git简介Git 是一个开源的分布式版本控制系统（也是代码托管平台的一种），用于敏捷高效地处理任何或小或大的项目。git安装（windows）https://git-scm.com/downloads安装完后使用电脑的命令
2021-11-26 16:29:28
446
原创 Vue移动端基于rem适配方案（简单易懂，无脑复制粘贴）
Vue移动端适配方案(vue-cli3)—— 相关npm包简述lib-flexible ：由淘宝团队整出的一种弹性布局方案，是一个制作H5适配的开源库postcss-loader：使用 PostCSS的方式处理csspostcss-px2rem：用于将 px 转换为 rem 的插件postcss-px2rem-exclude：postcss-px2rem不能忽略指定文件，此包用于增加排除注意：仔细看各段小标题！！！！！！npm安装npm install --save lib-flexi
2021-10-29 17:28:29
465
1
原创 浅显易懂、vue-cli跨域解决
vue-cli跨域解决前言步入正题跨域是什么？前言解决跨域我想在坐的各位都会听说过几个解决跨域的方法有什么 cors后端配置（加几个请求头）、jsonp（利用script的src属性）、还有vue-cli前端配置。本文讲述的就是vue-cli前端配置的方式解决跨域其实一说跨域就要想到很多问题跨域是什么？为什么会产生跨域？如何解决跨域…下面会 一 一 解答步入正题跨域是什么？跨域其实就是违背了浏览器的一种策略，这种策略就是同源策略（Same origin policy），头大 同
2021-10-14 19:06:35
469
原创 Vuecli2和Vuecli3初始化项目的过程，简单易懂
Vuecli2和Vuecli3初始化项目的过程，简单易懂介绍构建项目Vuecli2初始化项目过程介绍VueCLI 是一个基于 Vue.js 进行快速开发的完整系统，采用零配置等方式快速构建。扩展：CLI (Command-Line Interface)，翻译为命令行界面，是一个全局安装的 npm 包，提供了终端里的 vue 命令。俗称脚手架构建项目全局安装npm install –g vue-cliVuecli2初始化项目过程回车进入下一步操作一二runtime-comp
2021-06-03 16:20:07
253
原创 最容易理解的vuex，走过路过千万不要错过！！！
vuex状态管理初识在阅读本文章时，需要对 vue 有一定的熟悉了解，在不时很熟悉的情况下请到这里来哦初识vuex 又称vue状态管理。它是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。（听着属实有一点点蒙，说白了就是帮vue管理一些数据，使这些数据能在vue各组件之间共享）也有一个最大的特点 它管理的数据也都是响应式的// 定义一个store的实例对象，在这个对象中存放共享的数据let st
2021-05-18 16:39:00
206
2
原创 Vue Router的简单理解（包会）
Vue Router的简单理解前言初识前言Vue Router 是 Vue.js 官方的路由管理器。它和 Vue.js 的核心深度集成，它能够让构建单页面应用变得易如反掌。（来自官方的一段话）初识这里面所涉及到的后面都会有解释，文章阅读完后一定要再次回到这里哦安装//1、使用cdn或者直接下载该连接的文件//https://unpkg.com/vue-router/dist/vue-router.js//注意：vue路由是基于vue的，在引入vue-router之前先引入vue.js
2021-03-11 11:09:36
564
1
原创 浅显易懂防抖与节流、重绘与回流
防抖与节流防抖和节流其实就是为了对浏览器进行性能的优化，处理不当会造成卡顿现象。下面的代码可以动手实现以下，仔细体会就懂了防抖（debounce）当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次，如果设定的时间到来之前，又一次触发了事件，就重新开始计时。附：代码模拟html<div class="box"> <h2>防抖--debounce</h2> <div> <input type="text" id=
2020-11-30 19:20:54
363
2
原创 javascript中常用坐标属性
javascript中常用坐标属性MouseEvent(鼠标事件)属性都是MouseEvent对象下的属性，必须用该对象调用（只读）MouseEvent：当鼠标事件触发后都会产生此对象，该对象记录着鼠标触发事件时的所有属性例图：其常用的坐标属性有：clientX（clientY） 返回当事件被触发时鼠标指针相对于浏览器页面可视区域的水平坐标（left）、垂直坐标（top）注意： 此属性不论页面是否有滚动条，光标所在浏览器可视区域的位置都是固定的（简单理解为你在浏览器中看到的内容，就是
2020-10-13 15:05:06
807
原创 原生JS实现无缝轮播效果（自动/手动/焦点）
原生JS实现无缝轮播效果以下是效果图：以下是代码部分html结构：<body> <!-- 最大盒子 --> <div class="carousel"> <!-- 图片、左右按钮、小圆点区域 --> <div class="cal_list"> <!-- 图片（这里使用的是背景色） --> <ul class="move_ul"> <li>1</li>
2020-09-19 16:00:11
385
原创 css3弹性盒子模型（Flex）
Flex弹性盒子是 CSS3 的一种新的布局模式.，是一种当页面需要适应不同的屏幕大小以及设备类型时确保元素拥有恰当的行为的布局方式。
2020-09-13 17:45:33
644
一个汇集于前端所有知识点的面试宝典
2023-03-14
TA创建的收藏夹 TA关注的收藏夹
TA关注的人