- 博客(67)
- 资源 (7)
- 收藏
- 关注
RSS订阅原创 如何利用charles转包工具，测试本地微信授权以及分享相关
这两种方法都需要后端配合，下面我就来讲讲利用抓包工具charles来代理到本地进行测试。
2023-07-05 18:03:44
735
原创 windows 和华为手机使用charles抓包记录
直接在下载内容中可以看到WeiXin的目录,然后点开找到charles.crt文件，或者直接搜索.crt也行。最后到 系统设置→安全→更多安全设置→加密与凭据→从存储设备安装→CA 证书。华为手机打开微信，讲charles.crt文件保存。建议安装使用最新版，官方下载地址。把这个文件通过文件助手发送给手机。
2023-06-30 11:22:17
1835
3
原创 React复习
一、什么是Fiber可以从两个方面来理解：1.Fiber是一个任务单元在React16之前，整个virtual dom 树以及diff过程是一个大的任务，这样就会导致主线程被长时间占用，造成线程阻塞。React16将虚拟dom拆分一个个小的任务，在浏览器空闲时执行，每次执行完任务单元之后就会去检测有没有高级任务，如果有高级任务就执行高级任务，没有就继续执行Fiber任务。2.Fiber是一个数据结构可以将Fiber看做增强版的虚拟dom，Fiber对象描述了节点与节点的关系，支撑了整个Fibe
2022-02-20 20:50:02
454
原创 vscode 调试node cli的三种方式
A是运行项目， B是脚手架项目方式一: 通过program在B项目通过program(一般用来直接调试项目脚本) { "name": "Launch Program", "program": "${workspaceFolder}/app.js", "request": "launch", "skipFiles": [ "<node_internals>/**" ],
2021-12-08 11:34:00
642
原创 mac电脑改变npm 操作权限
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2021-07-08 13:25:10
245
原创 react native在mac m1上的环境配置
nodewatchmanxcode这些都可以照着官网操作下载android studio 需要安装预览版 和java 环境需要装arm版,百度网盘地址如下链接: https://pan.baidu.com/s/15W88SRRR5Na4Dr0GedmkyA 密码: nc4cios 端通过react native初始化过项目以后 需要cd ios 不断的pod installpod install 完成后按照 https://github.com/aiba/react-native-
2021-07-02 13:38:53
763
原创 练习手写reduce
reduce的核心就是把结果交给传进来的fn来出来Function.prototype.reduce = function (fn, init) { let arr = this // 找到当前的数组 let total = init || arr[0] // 如果是初始值就从第一项开始，没有初始值就从第二项开始计算 for (let i = init ? 0 : 1; i < arr.length; i++) { total = fn(total, arr[i], i, arr)
2021-06-10 10:16:09
89
原创 练习手写sleep
function sleep (tm) { return new Promise(resolve => setTimerout(resolve, tm))}sleep(2000).then(() => {console.log('hhah')})
2021-06-02 21:20:27
188
原创 练习手写bind、apply、call
Function.prototype.call2 = function (context, ...args) { // 1.先判断上下文为不为空，为空的话就默认是window对象 context = (context === undefined || context === null) ? window : context // 2.将this绑定到context.__fn上, this指向当前调用call2方法的函数 context.__fn = this // 3.调用context.
2021-06-02 20:54:58
68
原创 九、vue3.0
1.vue3.0介绍新增composition apivue3.0新增compositon api的形式，相比vue2.0options api形式，更容易将相同功能的逻辑组织到一起方便使用性能提升响应式系统升级编译优化源码体积的优化
2021-03-16 21:14:46
84
原创 vue源码分析
一、Vue 源码解析 - 响应式原理1.1 准备工作源码目录结构src├─compiler 编译相关├─core Vue 核心库├─platforms 平台相关代码├─server SSR，服务端渲染├─sfc .vue 文件编译为 js 对象└─shared 公共的代码vue采用flow静态类型检查器调试， vue 采用rollup打包工具,设置 sourcemap,package.json 文件中的 dev 脚本中添加参数 --sourcemap"dev": "
2021-01-27 00:01:05
1596
原创 六、vue-router、响应式、snabbdom原理
一、vue-router1.1 动态路由传参路由组价传参通过path中带有:id routes: [ { path: '/user/:id', component: User,}, ]通过props属性，让路由和组件解耦const User = { props: ['id'], template: '<div>User {{ id }}</div>'} const router = new VueRouter({ routes:
2021-01-06 10:36:30
325
原创 vue html2canvas qrcode生成二维码记录
"html2canvas": "1.0.0-rc.5", "qrcode": "^1.4.4",<template> <div class="notification" style="padding-bottom: 78px;"> <template v-if="detail"> <!-- v-show="!dialogTableVisible" --> <div cla
2020-12-30 16:06:06
309
原创 webpack打包练习与思考
一、简答题1、Webpack 的构建流程主要有哪些环节？如果可以请尽可能详尽的描述 Webpack 打包的整个过程。主要环节安装webpack ,yarn add [email protected] [email protected] -D配置webpack.config.js文件在webpack.config.js中配置entry, output以及mode根据要加载的文件类型，安装配置不同的loader加载器根据项目的需求，实现非loader的功能，安装相应的plugins
2020-12-19 21:58:39
411
1
原创 三、ECAMScript新特性、Typescript、性能优化、v8垃圾回收机制（笔记）
1.let、const1）块级作用域2）不能进行变量提升const定义常量，一开始就要有初始值，不能修改const obj = {}obj.name = ‘hhh’上述并没有修改obj的内存地址，所以是可以修改对象中的属性的。2.数组的解构3.对象的解构4.模板字符串可以直接换行可以插入值通过 \ 转译const str = `name is \`hahha\``// 输出name is `hahha`...
2020-12-05 21:49:59
1143
原创 一、函数式编程
1.为什么要学习函数式编程函数式编程是随着React的流行收到越来越多的关注Vue 3 也开始拥抱函数式编程函数式编程可以抛弃this打包过程中可以更好的利用tree shaking过滤无用代码方便测试、方便并行处理很多库可以帮助我们进行函数式开发：lodash、underscore、ramda2.函数式编程的定义(functional programming)简称FP,函数式编程就是把程序抽象到一起，做数据（函数）之间的映射，本质上是通过某种输入获得某种输出。纯函数：相同的输入要得到
2020-11-27 22:49:22
186
原创 vscode中配置eslint 和 prettier-eslint自动修复
1.首先先下载两个扩展Eslint和prettier Eslint2. 如图所示，将下面的这句话复制到vscode 的中settings.json "editor.codeActionsOnSave": { "source.fixAll": true }3.测试eslint自动修复有没有生效（项目中首先要安装eslint, npm i eslint）很简单在自己的项目中配置.eslintrc.js .prettierrc.js 然后保存试一下就行了..
2020-09-13 18:25:27
3419
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（七）——项目的优化
一般项目比较大的时候，这个时候如果不优化项目，h5项目就会加载很慢。这里提供一些优化技巧，其实一般项目都可以这样做，引入cdn，压缩代码，图片懒加载，splitChunk分割代码，去掉console.log下面代码示例。1.使用cdnvue.config.jsconst isProduction = process.env.NODE_ENV !== 'development' // 开发和测...
2020-04-16 00:04:09
519
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（六）——eslint和prettier相结合
前面一开始的时候我并没有在项目中增加eslint代码规范，eslint对于协同工作和代码规范都是很重要的工具，那么现在就在已有的项目上配置eslint。1.通过vue add eslint命令官网配置地址命令安装相关依赖之后，会弹出相关的配置选项1） Pick an ESLint config，选择Prettier2） Pick additional lint features: ...
2020-04-07 23:49:16
483
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（五）——路由权限配置，微信登录授权的设计思路以及测试微信登录授权的小技巧
这一章主要是讲路由权限配置，微信登录授权的设计思路以及测试微信登录授权的小技巧1.路由权限1）首先我们得在src目录新建一个setting.js文件setting.jsmodule.exports = { title: '', // 设置页面的过渡效果 needPageTrans: true, wxConfig: { appId: '0000', appSe...
2020-04-04 17:14:58
705
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（四）——指令、过滤器、路由、Store的配置、axios的二次封装以及使用
这一篇主要是指令、过滤器、路由、Store的配置、axios的二次封装以及使用1.过滤器的配置1)在filters目录新建filters/index.js,目录结构如下：└─src │ filters │ index.jsfilters/index.js/** * @description 过滤时间格式，传入时间戳， 根据参数返回不同格式 */// 过...
2020-03-29 23:54:51
421
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（三）——vue.config.js的配置和开发、生产、测试环境的全局变量配置以及使用
这一章主要是有关vue.config.js的配置和开发、生产、测试环境的全局变量配置以及使用
2020-03-26 16:16:53
924
原创 手把手教你构建vue项目（微信h5以及hybrid混合开发）（一）——项目目录结构
一、项目描述刚开始的时候，为了快速开发原生app以及微信h5网页。公司决定采用一套代码来解决，即用微信h5网页的代码，嵌套到原生端（ios和android）。这样开发起来原生端就方便快捷写，主要商品详情以及支付的逻辑都可以由微信h5这边来解决，只不过要对原生端进行兼容处理。那直接从项目结构说起吧。二、项目目录我这次主要用vue-cli4.0构建的项目，大家升级脚手架的时候可以参考其他的文章升...
2020-03-01 22:46:57
1469
原创 vue中使用WX-JSSDK的两种方法
公司最近有微信公众号的需求，那么微信登录授权和如何使用WX-JSSDk实现分享等等肯定是最头疼的问题。本人也是第一次开发微信公众号，在网上看了很多篇博客，最终选定了两种方法，并且亲测有效。一、通过全局，在router.afterEach中定义1.首先通过yarn add weixin-js-sdk/ npm i weixin-js-sdk2.将微信jsdk挂载到全局上在utils目录下新建...
2020-01-17 16:17:10
18332
1
原创 vue中使用指令解决iphonex底部的适配问题
vue中使用指令解决iphonex底部的适配问题在网上也看了很多的博客，怎么去解决iphoneX底部自适配的，最通用还是去用css的env(safe-area-inset-bottom)样式去解决，具体的用法我就不多说了，大家可以看下csdn env...
2019-12-14 18:58:05
3898
原创 本地搭建easymock（自动化启动服务redis和mongodb）
前端肯定需要做mock数据，然后根据mock数据去画页面，easymock是一个非常好用的工具，这里我根据网上的一些方法做些总结。要本地搭建easymock的原因，是因为easymock的官网太多人用，经常会蹦。一、安装redis下载地址，安装稳定版就可以了https://redis.io/download安装的时候直接下一步下一步，自定义...
2019-12-02 12:57:47
1805
5
原创 对组件中的v-model的理解
1.作用：v-model用于父子组件之间相互通信的一种方法 ,如果用传统的通过在子组件中的this.$emit通知父组件去$on去监听这个事件会很麻烦，v-model相对于更便捷一些2.使用：我们想在子组件中更改checked属性并且通知父组件中checked发生改变，我们可以将{{checked}}展示在页面中父组件<template> <div class="h...
2019-08-06 23:46:12
1137
原创 webpack入门基础
在webpack中一切皆模块,它做的主要事情是，分析你的项目结构，找到javascript模块以及其他的一些浏览器不能直接运行的拓展语言（scss,ts等等），并将其打包为合适的格式供浏览器识别。它能做哪些事：代码转化文件优化代码分割模块合并自动刷新代码校验自动发布它的核心就是loaders,plugins,module三大部分。可以参考我的github有关webpack...
2019-03-26 10:46:07
119
原创 sticky-footer固定底部布局
我们在开发的过程中会碰到内容很少，然后底部没有固定到底部的问题，因此，sticky-footer很关键。在这里我推荐两种方法方法1：使用flex布局，具体的可以看该目录下的demo1，其主要原理就是利用改变flex主轴方向为纵轴，内容部分设为flex：1，就是占主轴方向的剩下部分，即100vh-footer的高度（100vh相当于视图高度，1vh=1%*视图的高度）,示例请看demo1.html...
2019-01-17 18:22:51
1330
原创 Javascript this的简单理解
首先写这篇博客是为了整理我自己有关于this关键字的一些基本理解，让自己的关于this理解更深刻些，后面会把它整理的更加完善。javascript中this一直困扰着我，一下es5中的this，一下es6中的this，有时候自己容易晕，近期自己特意去看有关this的博客和文章，进一步加深了我对this的理解。JS中的this，在function内部创建。指向启用该函数的对象。this不...
2018-12-26 20:33:37
362
sourceTree
2018-04-21
vue-devtools-master含modules
2018-04-12
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人