自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(53)
  • 收藏
  • 关注

原创 react页面指定dom转pdf导出

1. 使用jsPDF+html2canvas将页面转成图片然后导出2. 自定义创建iframe调用iframe.print()进行页面打印转pdf导出3. 使用react-to-print插件打印pdf4. 利用@media print样式打印页面局部元素

2024-07-17 16:00:38 399

原创 Vue响应

其实通过前面对象的劫持也是可以实现数组的劫持,但是在。

2023-02-27 18:01:56 546 1

原创 rollup环境配置

首先在VScode中新建文件夹vue_sc,然后终端打开定位到打开的文件夹,输入“npm init -y”初始化配置项,运行成功之后文件夹新增package.json文件。配置rollup:在vue_sc下新建文件rollup.config.js和.babelrc。在vue_sc文件夹下新建文件夹src,然后在src文件夹下新建index.js入口文件。在根目录下创建index.html文件,引入dist/vue.js,打印Vue。在vue_sc文件夹下新建文件index.html。

2023-02-27 12:00:47 1171

原创 前端常用方法总结

【代码】前端常用方法总结。

2022-10-13 11:09:35 231 1

原创 VScode不能本地运行HTML或者路径后面出现出现其他符号

1. 报错显示报错:本地双击打开HTML文件时会出现以下情况:无法访问您的文件。该文件可能已被移至别处、修改或删除。 ERR_FILE_NOT_2. 解决删除google安装包下面的version.dll文件(我没成功,vension.dll文件我删除失败,每次删除之后又会马上出现)安装google以来,可以参考这位博主的方法,(我成功解决)...

2022-05-17 17:36:05 2449

原创 VScode安装离线插件

1. 下载及安装首先在VScode官方插件库下载自己所需要的插件:https://marketplace.visualstudio.com/vscode下载成功之后是以**.vsix**结尾的文件然后再VScode软件中进行导入刚下载的文件如果提示蓝色信息则为安装成功,红色则为失败2. 版本不兼容报错解决失败的主要原因是VScode与插件版本不一致,解决办法:2.1 方法一(1). 查看自己的VScode版本:用Win+R打开cmd,输入code --version即可得到(2

2022-05-17 17:19:22 23686

原创 ‘json-server‘ 不是内部或外部命令,也不是可运行的程序 或批处理文件。

报错:‘json-server’ 不是内部或外部命令,也不是可运行的程序 或批处理文件。解决:先以管理员打开cmd,然后输入npm config ls,复制prefix中的路径设置到环境中的系统变量的path中即可解决

2022-05-14 11:38:10 2290 2

原创 微信小程序学习笔记

1. 小程序-起步1.1 小程序简介1.1.1 小程序与普通网页开发的区别1.2 第一个小程序1.3 小程序代码的构成1.4 小程序的宿主环境1.4.1 什么是宿主环境1.4.2 小程序的宿主环境1.4.3 小程序宿主环境包含的内容2. 小程序-模板与配置2.1 使用WXML模板语法渲染页面结构2.1.1 数据绑定2.1.2 事件绑定2.1.3 条件渲染2.1.4 列表渲染2.2 使用WXSS样式美化页面结构2.2.1 rpx2.2.2 样式导入2.2.3 全局样式和局部样式2.3 使用app.json对.

2022-03-31 09:34:10 2168

原创 React学习报错

React学习报错1. 浏览器打开网页出错ERR_CONNECTION_REFUSED解决办法:在设置代理的时候注意下列红框的问题:2. 向路由组件传递search参数报错或querystring弃用​ 错误示图:​ 解决办法:在终端输入命令进行安装:npm i querystringif --save在js文件中引入:import qs from “querystringify”“querystringify”与querystring使用一样...

2022-03-31 09:08:59 1712

原创 React学习笔记4(ReactRouter6)

1. 概述2. Component2.1 BrowserRouter2.2 HashRouter2.3 Routes 与 Route2.4 Link2.5 NavLink2.6 Navigate2.7 Outlet3. Hooks3.1 useRoutes()3.2 useNavigate()3.3 useParams()3.4 useSearchParams()3.5 useLocation()3.6 useMatch()3.7 useInRouterContext()3.8 useNavigatio.

2022-03-26 22:44:31 187

原创 React学习笔记3(扩展)

1. setState1.1 setState更新状态的2种写法2. lazyLoad2.1 路由组件的lazyLoad3. Hooks3.1 React Hook/Hooks是什么?3.2 三个常用的Hook3.3 State Hook3.4 Effect Hook3.5 Ref Hook4. Fragment4.1 使用4.2 作用5. Context5.1 理解5.2 使用5.3 注意6. 组件优化6.1 Component的2个问题6.2 效率高的做法6.3 原因6.4 解决7. render p.

2022-03-26 16:49:22 112

原创 React学习笔记2

1. React应用(基于React脚手架)1.1 使用create-react-app创建react应用1.1.1 react脚手架1.1.2 创建项目并启动1.1.3 react脚手架项目结构1.1.4 功能界面的组件化编码流程(通用)1.2 一个简单的Hello组件1.3 组件的组合使用-TodoList2. React ajax2.1 React ajax认识2.1.1 前置说明2.1.2 常用的ajax请求库2.2 axios2.3 脚手架配置代理总结2.3.1 方法一2.3.2 方法二2.4 .

2022-03-24 18:03:01 1697

原创 React学习笔记(基础)

1. React基础1.1 React概述1.1.1 什么是React1.1.2 React的特点1.2 React的基本使用1.2.1 React的安装1.2.2 React的使用1.2.3 虚拟DOM的两种创建方式1.2.4 虚拟DOM与真实DOM1.2.5 jsx语法规则1.2.6 动态展示列表案例1.3 组件与模块2. React面向组件编程2.1 基本理解和使用2.1.1 开发者工具的安装2.1.2 函数式组件2.1.3 类式组件2.2 组件实例的三大核心属性2.2.1 state2.2.2 .

2022-03-14 21:20:31 218

原创 jQuery案例

1. 开关灯(jquery与dom对象转换案例)2. 下拉菜单(选择器案例)3. 突出展示(选择器案例)4. 手风琴(选择器案例)5. 淘宝服饰精品(选择器案例)6. tab栏切换(class操作案例)7. 下拉菜单(滑入与滑出案例)8. 360开机动画(自定义动画案例)9. 生成表格(动态创建元素案例)10. 城市选择(节点创建案例)11. 表格删除(清空和移除节点案例)12. 动态数据添加和删除(val()方法案例)13. 美女相册(操作属性案例)14. 表格全选反选(prop()方法案例)15. 固.

2022-03-09 21:15:54 6698 1

原创 jQuery学习笔记

1. 初始JQuery1.1 原生js的缺点1.2 体验jQuery2. JQuery的基础2.1 jQuery的入口函数2.2 $是一个函数2.3 DOM对象和jQuery对象3. jQuery元素设置3.1 设置获取文本内容text()3.2 设置获取样式css()3.3 设置类名class()3.4 设置属性attr()3.5 prop()操作布尔类型的属性4. 选择器4.1 基本选择器4.2 层级选择器4.3 过滤选择器-隔行变色4.4 筛选选择器(方法)5. 动画5.1 基本动画5.1.1 显示.

2022-03-09 21:14:41 1295

原创 CSS3练习题

1. 制作导航菜单综合练习题2. 切换背景图像综合练习题3. 制作3D旋转导航综合练习题4. 制作3D旋转视频展示区1. 制作导航菜单综合练习题<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>CSS制作立体导航</title> <link rel="stylesheet" href="http://www.w3cplus..

2022-03-05 22:36:16 659

原创 CSS3学习笔记2

1. CSS3中的变形与动画(下)1.1 Keyframes介绍1.2 animation的使用1.2.1 CSS3中调用动画1.2.2 CSS3中设置动画播放时间1.2.3 CSS3中设置动画播放方式1.2.4 CSS3中设置动画开始播放的时间1.2.5 CSS3中设置动画播放次数1.2.6 CSS3中设置动画播放方向1.2.7 CSS3中设置动画的播放状态1.2.8 CSS3中设置动画时间外属性2. 布局样式相关2.1 多列布局2.1.1 Columns2.1.2 column-width2.1.3 .

2022-03-05 22:34:49 251

原创 CSS3学习笔记

1. 初识CSS31.1 什么是CSS32. 边框2.1 圆角效果 border-radius2.2 阴影 box-shadow2.3 为边框应用图片 border-image3. 颜色相关3.1 颜色之RGBA3.2 渐变色彩4. 文字与字体4.1 text-overflow与word-wrap4.2 嵌入字体@font-face4.3 文本阴影text-shadow5. 与背景相关的样式5.1 background-origin5.2 background-clip5.3 background-siz.

2022-03-05 16:37:48 300

原创 Bootstrap学习笔记4

1. 下拉菜单与滚动监视器1.1 下拉菜单1.1.1 属性声明式方法1.1.2 JavaScript触发方法1.2 滚动监视器1.2.1 滚动监控器的设计1.2.2 声明属性触发滚动监控1.2.3 在body中加监控1.2.4 JavaScript方法触发滚动监控器2. 选项卡、提示框和弹出框2.1 选项卡-Tabs2.1.1 选项卡的结构2.1.2 触发切换效果2.1.3 为选择卡添加fade样式2.1.4 胶囊式选项卡(nav-pills)2.1.5 JavaScript触发方法2.2 提示框-Too.

2022-03-02 22:28:53 1075

原创 Sass学习笔记2

1. Sass的控制命令1.1 @if1.2 @for循环1.3 @while循环1.4 @each循环2. Sass的函数功能-字符串与数字函数2.1 字符串函数2.1.1 unquote()函数与quote()函数2.1.2 To-upper-case()、To-lower-case()2.2 数字函数2.2.1 percentage()2.2.2 round()函数2.2.3 ceil()函数2.2.4 floor()函数2.2.5 abs()函数2.2.6 min()函数、max()函数2.2.7.

2022-03-02 11:36:53 217

原创 Sass学习笔记1

1. Sass简介1.1 什么是CSS预处理器1.2 什么是Sass1.3 Sass与SCSS有什么区别2. Sass的语法格式及编译调试2.1 Sass语法格式2.2 Sass编译2.2.1 命令编译2.2.2 GUI 界面工具编译2.2.3 自动化编译2.3 不同样式风格的输出方法2.3.1 嵌套输出方式-nested2.3.2 展开输出方式-expanded2.3.3 紧凑输出方式-compact2.3.4 压缩输出方式-compressed2.4 Sass的调试3. Sass的基本特性-基础3.1.

2022-03-01 20:42:16 189

原创 Bootstrap学习笔记3

1. 导航条和分页导航1.1 导航条1.1.1 导航条基础1.1.2 基础导航条1.1.3 为导航条添加标题、二级菜单及状态1.1.4 带表单的导航条1.1.5 导航条中的按钮、文本和链接1.1.6 固定导航条1.1.7 响应式导航条1.1.8 反色导航条1.2 分页导航1.2.1 带页码的分页导航1.2.2 翻页分页导航1.3 标签1.4 徽章2. 其他内置组件2.1 缩略图2.2 警示框2.2.1 默认警示框2.2.2 可关闭的警示框2.2.3 警示框的链接2.3 进度条2.3.1 基本样式2.3.2.

2022-02-28 17:33:35 494

原创 Bootstrap学习笔记2

1. 表单1.1 表单提示信息1.2 按钮1.2.1 多标签支持1.2.2 按钮大小1.2.3 块状按钮1.2.4 按钮状态1.3 图像1.4 图标2. 网络系统2.1 工作原理2.2 基本用法3. 菜单、按钮及导航3.1 下拉菜单3.1.1 基本用法3.1.2 下拉分隔线3.1.3 菜单标题3.1.4 对齐方式3.1.5 菜单项状态3.2 按钮3.2.1 按钮组3.2.2 按钮工具栏3.2.3 嵌套分组3.2.4 垂直分组3.2.5 等分按钮3.2.6 按钮下拉菜单3.2.7 按钮的向下向上三角形3.3.

2022-02-24 17:21:44 505

原创 Bootstrap学习1

1. Bootstrap的认识2. 如何使用Bootstrap3. Bootstrap用法3.1 主副标题3.2 让一个段落**p**突出显示3.3 强调相关的类3.4 文本对齐风格3.5 列表3.6 代码风格4. 表格5. 表单5.1 表单分类5.1.1 基础表单5.1.2 水平表单5.1.3 内联表单5.2 表单控件5.2.1 输入框-input5.2.2 下拉选择框-select5.2.3 文本域-textarea5.2.4 复选框-checkbox和单选择按钮-radio5.2.5 按钮5.2.6.

2022-02-21 22:11:57 713

原创 MongoDB学习

1. 数据库分类2. MongoDB简介3. MongoDB下载及安装过程3.1 MongoDB下载3.2 MongoDB安装过程3.3 MongoDB图像化工具4. MongoDB的基本操作4.1 基本概念4.2 基本指令4.3 数据库的CRUD的操作4.3.1 向数据库中插入文档4.3.2 查询数据库中的文档4.3.3 修改数据库中的文档4.3.4 删除数据库的文档5. MongoDB文档间的关系6. MongoDB投影和_sort7. mongoose简介7.1 mongoose概念7.2 mong.

2022-02-08 22:08:26 784

原创 VUE学习笔记4

1. tabbar学习1.1 tabbar-基本结构的搭建1.2 tabbar-TabBar和TabBarItem组件封装1.3 tabbar-给TabBarItem传入active图片1.4 tabbar-TabBarItem的颜色动态控制1.5 tabbar-文件路径的引用问题2. Promise学习2.1 Promise的介绍和使用2.2 Promise的三种状态和另外处理方式2.3 Promise的链式调用2.4 Promise的all方法使用3. Vuex学习3.1 Vuex概念和作用解析3.2.

2022-01-29 16:28:22 624

转载 报错:Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: “

Uncaught (in promise) NavigationDuplicated: Avoided redundant navigation to current location: "/cart报错解决办法:在router下index.js中加入下面代码1. replaceconst originalReplace = VueRouter.prototype.replace;VueRouter.prototype.replace = function replace(location) {

2022-01-24 11:08:52 675

原创 VUE学习笔记3

1. VUE CLI 相关1.1 vuecli-脚手架的介绍与安装1.2 vuecli-初始化项目过程1.3 安装CLI错误和ESLint规范1.4 [runtime-compiler与runtime-only的区别](https://www.cnblogs.com/bjyx/p/13525039.html)1.4 VueCLI3创建项目与目录结构1.5 VueCLI3配置文件的查看和修改1.6 箭头函数的使用与this指向1.6.1 箭头函数的基本使用1.6.2 箭头函数的参数和返回值1.6.3 箭头函.

2022-01-23 20:15:33 486

原创 VUE学习笔记2

VUE学习笔记21. 插槽slot1.1 slot-插槽的基本使用1.2 slot-具名插槽的使用1.3 编译作用域1.4 作用域插槽的使用2. 模块化开发2.1 CommonJS2.2 ES6的模块化实现3. webpack的使用3.1 webpack的介绍3.2 webpack 的基本使用过程3.3 webpack的配置3.4 webpack中使用css文件的配置3.4.1 安装css-loader3.4.2 安装style-loader3.5 webpack-less文件的处理3.6 webpack-

2022-01-20 15:30:11 242

原创 报错:webpack : 无法加载文件 D:\Program Files\nodejs\node_global\webpack.ps1,因为在此系统上禁止运行脚本

在WebStrom中运行 webpack ./src/main.js ./dist/bundle.js 报如下错误:解决方案:1. 按照下面步骤打开2. 输入下列命令set-ExecutionPolicy RemoteSigned然后输入:Y

2022-01-19 11:40:12 487

原创 webpack安装

webpack安装1. 查看自己的node版本node -v2. 全局安装webpack这里先安装指定版本号3.6.0,因为vue cli2依赖该版本先使用 webpack --version查看是否已经安装,没有安装执行下列命令,-g是指全局安装npm install webpack@3.6.0 -g...

2022-01-19 10:20:27 649

原创 VUE学习笔记1

VUE学习笔记11. Vuejs的内容概述Vue是一个渐进式的框架(渐进式意味着你可以将Vue作为你应用的一部分嵌入其中,带来丰富的交互体验)Vue有很多特点和Web开发中常见的高级功能解耦视图和数据可复用的组件前端路由技术状态管理虚拟DOM官方网站:https://vuejs.bootcss.com/guide/安装vue的方法1.1 Vuejs初体验<body><div id="app"> <h2>{{mes

2022-01-18 16:51:41 297

原创 JavaScript中高阶函数filter,map,reduce的使用

JavaScript中高阶函数filter,map,reduce的使用1. filter函数的使用注意:filter中的回调函数有一个要求: 必须返回一个boolean值true: 当返回true时, 函数内部会自动将这次回调的n加入到新的数组中false: 当返回false时, 函数内部会过滤掉这次的n let nums = [10, 20, 111, 222, 444, 40, 50]; // filter函数的使用 let newArr = nums.filter(functi

2022-01-17 10:35:54 152

原创 Python 基础

1. 安装python环境cmd里面输入python(已经安装如下显示)设置全局变量2. python基础2.1 python变量命名规范: 不能以数字、特殊字符开头,不能以关键字命名 英文单词、下划线、数字的组合 first_name_123='' 大驼峰 FirstName 小驼峰 firstName第一次出现变量名称就是定义,后许多次出现变量名称就是多次赋值2.2 python数据类型

2021-12-19 21:40:30 647

原创 JavaScript 详细学习笔记5

JavaScript 详细学习笔记51. PC端网页特效1.1 元素偏移量offset系列offset翻译过来就是偏移量,使用offset系列相关属性可以动态的得到该元素的位置(偏移)、大小等。获得元素距离带有定位父元素的位置获得元素自身的大小(宽度高度)注意:返回的数组不带单位offset系列常用相关属性:offset系列属性作用element.offsetParent返回作为该元素带有定位的父级元素,如果父级都没有定位则返回bodyelem

2021-12-16 20:39:59 1005

原创 PC端网页特效案例

PC端网页特效案例1. 获得鼠标在盒子内的坐标 <style> .box { width: 300px; height: 300px; background-color: pink; margin: 200px; } </style><body> <div class="box"></div>

2021-12-16 20:18:39 218

原创 JavaScript BOM 案例

BOM 案例1. 5秒后自动关闭广告<body> <img src="images/ad.jpg" alt="" class="ad"> <script> var ad=document.querySelector('.ad'); setTimeout(function(){ ad.style.display='none'; },5000); </script&gt

2021-12-15 20:01:15 940

原创 JavaScript 详细学习笔记4

JavaScript 详细学习笔记41. 事件高级1.1 注册事件给元素添加事件,称为注册事件或者绑定事件1.1.1 传统注册事件利用on开头的事件 比如onclick特点:注册事件的唯一性–>同一个元素同一个事件只能设置一个处理函数,最后注册的处理函数将会覆盖前面注册的处理函数1.1.2 方法监听注册事件W3C标准 推荐方式addEventListener() 它是一个方法IE9以前的IE不支持此方法,可使用attachEvent()代替同一个元素同一事件可以注册多个

2021-12-15 20:00:03 664

原创 JavaScript 事件案例

JavaScript 事件案例1. 跟随鼠标的天使<style> /* 跟随鼠标的天使 */ img{ position: absolute; top: 2px; }</style><body> <!-- 跟随鼠标的天使 --> <img src="images/angel.gif" alt=""> <script

2021-12-14 16:50:04 191

原创 css的div盒子居于页面正中间

css的div盒子居于页面正中间1. HTML代码<body> <div class="father"> <div class="son">son盒子</div> </div></body>2. 实现效果3. 实现方法<style> *{ margin: 0; padding: 0;

2021-12-13 16:56:45 2502 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除