- 博客(59)
- 收藏
- 关注
RSS订阅原创 python2.0 默认编码错误：SyntaxError: Non-ASCII character ‘\xe5‘
由于 python2.0 默认采用 ASCII 编码对输入的字符串进行编码，如果代码文件中出现了非 ASCII 字符（例如中文字符），则无法正确进行编码，会出现报错信息：SyntaxError: Non-ASCII character '\xe5'
2023-12-16 12:20:43
381
原创 VuePress + Github Pages 搭建博客网站
VuePress + Github Pages 搭建博客网站，VuePress 是基于 Vue 的静态网站生成器，GitHub Pages 是通过 GitHub 托管和发布的公共网页
2022-09-04 21:50:14
515
1
原创 react+antd日期选择组件二次封装
react 项目，基于 Ant-Design 的 DatePicker 组件的二次封装，实现以下功能：预设 昨天，今天，上周，本周，上月，本月 时间范围快捷选择，设置只能选择某天数范围之内的日期，默认无限制，设置某天以后的时间不能选择，默认今天...
2022-08-09 20:41:16
1338
1
原创 常用vscode配置和插件
VSCode 是微软2015年推出的一个轻量但功能强大的源代码编辑器，基于 Electron 开发，支持 Windows、Linux 和 macOS 操作系统。它内置了对 JavaScript，TypeScript 和 Node.js 的支持并且具有丰富的其它语言和扩展的支持，功能超级强大。VSCode 是一款免费开源的现代化轻量级代码编辑器，支持几乎所有主流的开发语言的语法高亮、智能代码补全、自定义快捷键、括号匹配和颜色区分、代码片段、代码对比 Diff、GIT 命令 等特性，支持插件扩展......
2022-07-10 22:21:53
1434
原创 Happy Children‘s Day
儿童节快乐 Happy Children's Day 值此六一儿童节之际，祝程序员朋友们儿童节快乐，愿大家充满童心，天天快乐！
2022-06-01 08:16:57
258
2
原创 react项目本地开发环境设置https
react 项目本地开发，使用 mkcert 工具生成 CA 受信任的本地 SSL 证书，模拟 https 环境
2022-05-30 11:02:52
2390
原创 js函数柯里化
函数柯里化函数柯里化(Currying) 是 js 函数式编程的一项重要应用，指的是将原来接受两个参数的函数变成新的接受一个参数的函数的过程，新的函数返回一个以原有第二个参数为参数的函数，这些函数不会立即求值，而是通过闭包的方式把传入的参数保存起来，直到真正需要的时候才会求值...
2021-01-06 13:49:58
325
原创 vue图片裁剪插件：vue-img-cutter
vue图片裁剪插件：vue-img-cuttervue-img-cutter 是一个简单易用的 vue 图片裁剪插件，支持旋转、缩放、平移，固定比例，固定尺寸，远程图片裁剪，只需要很少的代码就可以实现裁剪功能，也可以通过调整参数以适应你自己的业务需求Github：https://github.com/acccccccb/vue-img-cutter特点：兼容IE9+，MSEdge，Chrome，Firefox两种展现形式，行内或弹窗可旋转、缩放图片任意比例、大小裁剪固定比例、大小裁剪支持
2020-12-28 16:53:08
6547
9
原创 vue3.0 Composition API上手体验
vue3.0对比vue2.0优势框架内部醉了大量性能优化，包括：虚拟dom，编译模板，Proxy的新数据监听，更小的打包文件等新的组合式API（即composition-api），更适合大型的项目的编写方式对Typescript支持更好，去除了繁琐的this操作，更强大的类型推导TypescriptTypescript是javascript类型的超集，它可以编译成纯的javascriptTypescript可以再任何浏览器、任何计算机和任何操作系统上运行，并且是开源的Typescript
2020-12-25 13:45:00
679
1
原创 puppeteer实现浏览器自动化和爬虫
puppeteer实现浏览器自动化和爬虫puppeteer 是谷歌官方出品的一个通过 DevTools 协议控制 headless Chrome 的 Node 库，它提供了一个高级 API 来通过 DevTools 协议控制 Chromium 或 Chrome，可以实现浏览器自动化测试或爬虫puppeteer 是浏览器自动化的产品。安装后，它会下载一个版本的 Chromium，然后使用puppeteer-core 驱动工作puppeteer-core 是一个库，来帮助驱动任何支持 DevTools
2020-12-21 15:47:41
2035
4
原创 ES6 iterable类型
ES6 iterable类型iterable 是 ES6 标准引入的新类型，Array、Set 和 Map 都属于 iterable 类型Array：数组，有序的元素序列，用于在单个的变量中存储多个值Set：ES6 中新增的数据结构，类似于数组，区别在于 Set 没有索引，且成员的值都是唯一的，没有重复的值Map：ES6 中新增的数据结构，类似于对象，区别在于普通对象的 key 必须是字符串或者数字，而 Map 的 key 可以是任何数据类型for…in 循环iterable 类型引入原因：
2020-12-16 14:11:26
295
原创 ES6 let解决的闭包问题
ES6 let解决的闭包问题ES6 letlet 是 ES6 新增的命令，用来声明变量let 用法和 var 类似，区别：var 声明变量存在变量提升，let 不存在变量提升var 可以重复声明变量，let 不可以重复声明let 声明变量存在块作用域（{} 内）js 闭包闭包 就是能够读取其他函数内部变量的函数。由于 js 作用域链，只有函数内部的子函数才能读取函数内部的局部变量，所以可以把闭包简单理解成"定义在一个函数内部的函数"，本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁
2020-12-09 16:42:12
925
原创 ES6 Promise的基本使用
ES6 Promise的用法什么是 PromisePromise 是异步编程的一种解决方案，比传统的解决方案：回调函数和事件，更合理和更强大。它由社区最早提出和实现，ES6 将其写进了语言标准，统一了用法，原生提供了 Promise 对象Promise 对象两个特点:1、对象的状态不受外界影响。Promise 对象代表一个异步操作，有三种状态：pending：（进行中）初始状态，没有变为成功或失败fulfilled：（已成功）意味着操作成功完成rejected：（已失败）意味着操作失败
2020-12-08 16:20:15
144
原创 vue可响应式的数组方法
vue可响应式的数组方法由于 js 的限制，vue 不能检测以下数组的变动：利用索引直接设置一个数组项时，例如：this.items[indexOfItem] = newValue修改数组的长度时，例如：this.items.length = newLength全局方法 Vue.set() 利用索引为数组添加响应式元素：Vue.set(Array, index, newValue) 或者 this.$set(Array, index, newValue)vue 将被侦听的数组的变异方法（
2020-12-07 10:51:25
983
原创 Array.prototype.slice.call(arguments)和Array.prototype.push.apply(arr1, arr2)
Array.prototype.slice.call(arguments)和Array.prototype.push.apply(arr1, arr2)Array.prototype.slice.call(arguments)Array.prototype.slice.call(arguments) 能将具有 length 属性的对象（类数组对象）转成数组，除了 IE 下的节点集合（因为 ie 下的 dom 对象是以 com 对象的形式实现的，js 对象与 com 对象不能进行转换）//定义一个具有l
2020-12-04 16:49:25
539
原创 浏览器全屏API
浏览器全屏API全屏 API为使用用户的整个屏幕展现网络内容提供了一种简单的方式，并且在不需要时退出全屏模式。这种 API 让你可以简单地控制浏览器，使得一个元素与其子元素，如果存在的话，可以占据整个屏幕，并在此期间，从屏幕上隐藏所有的浏览器用户界面以及其他应用全屏 API 提供了一些其他接口以供实现全屏所需的方法、属性、事件处理函数全屏 API 方法：Element.requestFullscreen(options)：请求浏览器（user agent）将特定元素（甚至延伸到它的后代元素）设置
2020-12-03 15:50:54
455
原创 vue插件开发：vuex模块化懒加载插件
vue插件开发：vuex模块化懒加载插件vue 插件插件通常用来为 Vue 添加全局功能。插件的功能范围没有严格的限制，一般有下面几种：添加全局方法或者 property。如：vue-custom-element添加全局资源：指令/过滤器/过渡等。如 vue-touch通过全局混入来添加一些组件选项。如 vue-router添加 Vue 实例方法，通过把它们添加到 Vue.prototype 上实现。一个库，提供自己的 API，同时提供上面提到的一个或多个功能。如 vue-
2020-12-03 11:24:57
484
1
原创 js实现继承的方法
js函数的继承方法构造函数、原型和实例的关系：构造函数是用来创建对象的函数，其本质也是函数，与普通函数的区别在于构造函数通过 new 操作符来调用每个构造函数都有一个原型对象（propertype），原型对象都包含一个指向构造函数的指针（constructor），而实例都包含一个指向原型对象的内部指针（__ proto __）原型链继承//父类构造函数Peoplefunction People(name) { //属性 this.name = name //方法
2020-12-02 17:06:24
191
1
原创 cnpm安装使用
cnpm安装配置使用配置 cnpm 淘宝源npm config set registry https://registry.npm.taobao.org验证返回 https://registry.npm.taobao.orgnpm config get registry安装 cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org版本检查返回版本号cnpm -v使用 cnpmcnpm ins
2020-12-01 15:16:01
806
原创 js判断数据类型的方法
js判断数据类型的方法typeof 判断数据类型JavaScript 中使用 typeof 判断数据类型，只能区分基本类型（number、string、boolean、undefined、function、object），如果数据类型为 null、array、object ，使用 typeof 判断都会统一返回 ‘’object‘’ 字符串console.log(typeof(1)) //numberconsole.log(typeof('a')) //stringconsole.log(
2020-11-24 16:25:37
159
1
原创 Intersection Observer实现图片懒加载
Intersection Observer实现图片懒加载Intersection Observer 的概念和用法Intersection Observer API提供了一种异步检测目标元素与祖先元素或 viewport 相交情况变化的方法，可以自动“观察”元素是否可见，可见的本质是目标元素与视口产生一个交叉区域，所以这个 API 叫做“交叉观察器”Intersection Observer API 允许你配置一个回调函数，每当目标(target)元素与设备视窗或者其他指定元素发生交集的时候执行。设备视
2020-11-16 16:46:35
549
原创 Vue.extend实现全局Toast提示组件和Dialog对话框组件封装
Vue.extend实现Alert和Toast组件封装Vue.extend() 使用Vue.extend 属于 Vue 的全局 API，相比常用的 Vue.component 写法，使用 Vue.extend 步骤更加繁琐一些，但是在一些独立组件开发场景中，Vue.extend + $mount 这对组合使一些动态渲染或者使用 js 全局调用的组件变得更加灵活Vue.extend() 方法返回一个组件构造器，通过组件构造器创建组件实例，该实例的参数是一个包含组件选项的对象，用来在实例上扩展属性和方法
2020-11-13 21:05:38
1121
原创 vuecli项目构建SSR服务端渲染
通过vuecli项目构建ssr服务端渲染服务端渲染（SSR）Vue.js 是构建客户端应用程序的框架，可以在浏览器中输出 Vue 组件，进行生成 DOM 和操作 DOM。我们也可以将同一个组件渲染为服务器端的 HTML 字符串，将它们直接发送到浏览器，最后将这些静态标记"激活"为客户端上完全可交互的应用程序服务器渲染的 Vue.js 应用程序也可以被认为是"同构"或"通用"，因为应用程序的大部分代码都可以在服务器和客户端上运行为什么使用 服务端渲染（SSR）更好的 SEO：传统的 spa 页面数
2020-10-28 10:54:36
1321
5
原创 gulp自动生成精灵图
gulp自定生成精灵图gulp 是基于 Node.js 的一个前端自动化构建工具，主要用来设定程序自动处理静态资源的工作，您可以使用它构建自动化工作流程（前端集成开发环境）精灵图（sprite）是一种图片整合技术，将大量的小图片合成到一张图片上，然后使用 css 的 background-image 和 background-position 属性来定位显示图片，从而减少服务器接收和发送请求的次数，提高页面的加载速度gulp 中可以使用 gulp.spritesmith 插件完成小图片合成精灵图，并自
2020-10-14 13:34:21
2404
10
原创 vuex在刷新页面时保持数据不变（vuex状态持久化）
vuex在刷新页面时保持数据不变created(){ //在页面加载时读取sessionStorage里的状态信息 this.$store.state.userInfo = window.sessionStorage.getItem("userInfo") //在页面刷新时将vuex里的信息保存到sessionStorage里 window.addEventListener("beforeunload", () => { window.sessionStora
2020-06-09 16:19:53
3783
2
原创 微信小程序版本更新机制
微信小程序版本更新机制微信小程序运行机制前台/后台状态小程序启动后，界面被展示给用户，此时小程序处于前台状态当用户点击右上角胶囊按钮关闭小程序，或者按了设备 Home 键离开微信时，小程序并没有完全终止运行，而是进入了后台状态，小程序还可以运行一小段时间当用户再次进入微信或再次打开小程序，小程序又会从后台进入前台。但如果用户很久没有再进入小程序，或者系统资源紧张，小程序可能被销毁，即完全终止运行小程序启动小程序启动可以分为两种情况，一种是冷启动，一种是热启动冷启动：如果用户首次打开，或小程
2020-06-09 15:59:21
784
1
原创 Vue项目优化: 使用vue-lazyload插件实现图片懒加载
Vue项目优化: 使用vue-lazyload插件实现图片懒加载vue-lazyloadvue-lazyload插件用于 vue 项目中图片的懒加载npm地址：https://www.npmjs.com/package/vue-lazyloadvue-lazyload安装通过npm安装npm install vue-lazyload --save-dev通过CDN引入使用<script src="https://unpkg.com/vue-lazyload/vue-lazyload
2020-06-08 15:25:03
456
原创 TypeScript的使用
TypeScript的使用TypeScript是一种由微软开发的自由和开源的编程语言。它是JavaScript的一个超集，而且本质上向这个语言添加了可选的静态类型和基于类的面向对象编程。TypeScript扩展了JavaScript的语法，所以任何现有的JavaScript程序都可以运行在TypeScript环境中TypeScript是为大型应用的开发而设计，并且可以编译为JavaScript...
2020-05-11 08:44:43
520
原创 canvas的使用
canvas的使用HTML5 < canvas > 标签是一个可以使用脚本(通常为JavaScript)来绘制图形的 HTML 元素，是众多广泛使用的网络 2D 图像渲染标准之一，可以用于绘制图表、制作图片构图或者制作动画canvas 元素本身并没有绘制能力（仅仅是图形的容器），它公开了一个或多个渲染上下文，必须使用脚本来完成实际的绘图任务canvas基本使用相比于 img 元...
2020-03-11 20:55:28
1333
原创 fetch的使用及和ajax的区别
fetch的使用及和ajax的区别fetch和ajax的区别：当接收到一个代表错误的 HTTP 状态码时，从 fetch() 返回的 Promise 不会被标记为 reject， 即使该 HTTP 响应的状态码是 404 或 500。相反，它会将 Promise 状态标记为 resolve （但是会将 resolve 的返回值的 ok 属性设置为 false ），仅当网络故障时或请求被阻止时...
2020-03-09 17:15:27
1194
原创 js函数防抖和节流
js函数防抖和节流函数防抖（debounce）触发事件后在 n 秒内函数只会执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间函数节流（throttle）连续触发事件但是在 n 秒内只会执行一次函数，减少函数的执行频率...
2020-03-03 11:43:50
171
1
原创 Vue生命周期钩子函数
Vue生命周期函数beforeCreate实例被创建之前，此时实例还没有被创建，无法获取data，不能使用watch监听created此时实例已经创建，可以获取data，调用watch监听，但是页面还是空白beforeMount页面挂载前，页面依然是空白，此时render函数首次被调用mounted页面挂载了，此时页面已经有内容，可以访问到dombeforeUpdate数据更...
2020-02-24 13:28:02
244
原创 webpack基本使用
webpackwebpack 是一个现代 javascript 应用程序的静态模块打包器（module bundler）webpack基本使用webpack打包的基本配置新建目录： dist（打包后存放目录）， src（源代码目录）下面新建 main.js初始化：npm init安装依赖包：npm install webpack webpack-cli -Dpackage...
2020-02-21 19:56:02
212
原创 移动端适配方案
移动端适配方案百分比适配viewport适配js:window.onload = function() { //获取屏幕宽度 var screenW = window.screen.width; //目标宽度（以ip6的375为例） var targetW = 375; //设置缩放比例，使不同设备宽度均为目标宽度 var scale = s...
2020-02-19 14:31:49
340
原创 跨域解决方案
跨域解决方案跨域（非同源策略请求）同源策略：同源策略是浏览器的一个安全限制，‘协议，域名，端口’，三个都相同即为同源。其中一个不同即为非同源，非同源下三种行为受到限制：cookie无法获取，dom无法获取，ajax请求无效跨域：当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域跨域的几种解决方案：JSONP 实现跨域JSONP 是使用方法回调的原理，sc...
2020-02-14 20:45:57
263
原创 Vue组件之间的传值
vue组件之间的传值vue组件之间的传值大致分为三种：父组件给子组件传值，子组件给父组件传值，兄弟组件之间传值此文介绍vue组件之间简单的数据传递，如果数据过于复杂，建议使用vue的状态管理模式 vuex父组件给子组件传值父组件通过props给子组件传值props 就是父组件给子组件标签上定义的属性，用来接收父组件传递的数据，props 的值可以是字符串数组，也可以是各自的名称和类型，用...
2020-01-17 11:20:43
367
原创 new关键字执行过程的简单理解
new关键字执行过程的简单理解demo：//定义构造函数Fnfunction Fn(a, b) { this.a = a; this.b = b; this.add = function() { console.log(a + b); }}//通过关键字new创建对象var fn = new Fn(1, 2)fn.add() //3...
2020-01-16 10:12:25
594
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人