- 博客(70)
- 收藏
- 关注
RSS订阅原创 一定要看的修改微信扫码登录鉴权样式的大坑
在修改样式遇到最大的坑就是编译成base64后没想到浏览器解析时会和原来的字符不一样，没有去对比两个字段耽误了很多时间，在这里记录一下以后做鉴权可以参考。经过对比会发现控制台返回的这段base64编译字段和我们从工具处复制的不一样，这是浏览器自己解析时将一些关键字直接解析了，以至于根本拿不到正确的文件。在这里需要去申请对应的域名和id，这个过程需要审核，需要提前申请，具体可以参考微信开放平台的使用文档【在接入第三方微信鉴权时踩了很多坑，由于之前没有做过，查询的信息也不够，所以在这里总结一下。
2023-02-09 11:10:07
428
原创 react怎么锁版本
由于antd组件库版本更新，提交上去的代码在构建时自动检测下载了最新版本，导致出现一些bug，针对这种情况，暂时不想使用最新版本的工具时，可以锁版本，这样构建出来的一定是需要的那个版本。3、删除package.sjon中依赖里面的小冒尖，这个冒尖的意思是该版本以上都可以，例如 ^4.9.12 即 4.9.12 以上都可以，那么就会自动给你下载最新的。重新下载依赖，生成package.lock.json文件。下载了package.lock.json，这样才算成功。,修改了自己想要的版本之后，再重新。
2022-10-12 17:06:09
580
原创 归并排序实例
归并排序实列 function merge(left, right) { // 创建一个空数组 var re = []; // 一个如果两个数组都不为空 while (left.length > 0 && right.length > 0) { if (left[0] < right[0]) {
2021-11-03 17:09:50
244
原创 根据 parentId 对对象数组进行重构
根据 parentId 对对象数组进行重构题目：const nodeList = [{ id: '3', parentId: '1' }, { id: '1', parentId: '' }, { id: '2', parentId: '4' }]根据 parentId 和 id 相匹配，重构对象数组得到：const re = [{ id: '1', parentId: '', children: [{
2021-09-25 16:22:36
565
原创 leetCode -- 三数之和
var arr = [-1,0,1,2,-1,-4]; var result = []; var obj = {}; var num = []; arr.sort((a,b) => a - b); //[-4,-1,-1,0,1,2] arr.forEach((item,index) => { var value = 0 - item; var i = 0; var j = arr.length-1; ...
2021-09-15 15:49:50
85
原创 找出数组中三个元素之和为目标值的数
找出数组中三个元素之和为目标值的数 let arr = [-10,2,3,4,5,10,6,7,8] arr = arr.sort() //从小到大排序 -10,2,3,4,5,6,7,8,10 let num = [] // 创建一个空数组 target = 15; function fn(arr) { for(let i=0; i< arr.length; i++){ let value = target - arr[i]
2021-09-07 16:39:11
991
原创 js 遍历实现深拷贝
js 遍历实现深拷贝之前写过利用 JSON.stringify 和 JSON.parse 来实现深拷贝这篇笔记利用遍历迭代的方式实现深拷贝遍历实现深拷贝 function deepCopy(obj) { var newobj = null; //创建一个新对象，置为null if(typeof obj == 'object' && obj != null){ //判断传入的被拷贝obj是否为一个对象，是否为null
2021-07-29 16:22:13
480
原创 js 中的深拷贝和浅拷贝
js 中的深拷贝和浅拷贝之前经常有被问到深拷贝和浅拷贝，但是一直有些模糊，所以在这里简单的写一下笔记，以便以后查阅浅拷贝 let arr = [1,3,4,{ username: 'hjc' }]; let arr1 = arr; //浅拷贝 arr1.push(7); //只对 arr1 做 push 操作 arr[3].username = 'wu'; //只修改 arr 中的 username con
2021-07-21 18:32:25
139
原创 事件冒泡解决办法
事件冒泡解决办法假设有外层元素和内层元素，两个元素都绑定了点击事件，当只点击内层元素会同时出发内层元素和外层元素的事件，就是事件冒泡举个例子：这里有内层的按钮，中层的 div 块和外层的 div 块 <div @click = "outside" id = "outside"> outside <div @click = "middle" id = "middle"> middle
2021-07-12 15:06:02
1416
原创 js 中有关 this 的指向应用(1)
js 中有关 this 的指向应用(1)当使用 forEach 或 setTimeout 方法时，里面的 function 是回调函数，这个时候回调函数的 this 总是指向 window 的，那么想要使用声明定义函数的那个变量域中的参数时，就没有办法使用，例如下面这种情况 var obj1 = { myName: 'hjc', fruits: ['apple','banana','icecream'], fn(){ this.f
2021-07-07 16:06:21
90
原创 js中变量提升
js中变量提升 var name = 'tom' function change() { alert(name) // undefined var name = 'lily' alert(name) //lily } change()相当于 var name = 'tom' function change() { var name // 变量提升 alert(na
2021-06-25 19:57:39
123
原创 “export ‘createStore‘ was not found in ‘vuex‘报错
"export ‘createStore’ was not found in 'vuex’报错可能是因为版本的原因，将vuex升到4.0.0就能够解决在升级时也可能会遇到下面这种问题npm WARN vuex@4.0.0 requires a peer of vue@^3.0.2 but none is installed. You must install peer dependencies yourself.这种情况按照要求改变vue的版本，再重新安装vuex为4.0.0就好了npm ins
2021-06-17 17:16:47
2729
2
原创 vue-router 传值的三种方式
上次被问到路由之间如何传值，我一整个蒙住，但其实在项目中也有用到过，所以今天把这些方法整理出来，以后便于翻阅1. query 传值在主页面中写一个按钮，绑定方法<button @click="sentMesg()">兄弟页面</button>通过 path 来连接和组件页面 brother 之间的关系sentMesg(){ this.$router.push({ path:'/brother', query: { .
2021-06-15 21:49:42
9620
1
原创 兄弟组件间的传值 - $bus
兄弟组件间的传值 - $bus兄弟组件之间的传值方式有很多，例如很方便的 vuex，或者通过传父组件再传兄弟组件，这里介绍 vue 中的 $bus 的使用方法首先在 main.js 中创建一个新 vue 实列import Vue from 'vue'import App from './App'import router from './router'import Vant from 'vant';import 'vant/lib/index.css';Vue.prototype.$
2021-06-14 22:17:55
3774
4
原创 怎么画一条高 0.5px 的线
怎么画一条高 0.5px 的线利用 CSS 中的转换属性 transform 中的 scale() 方法举个栗子就很好懂：<body> <div></div></body>定义它的 CSS 样式<style> div { background-color: blueviolet; //背景色 height: 1px; //高度为 1px width: 200px; //宽度为 200px
2021-06-13 13:54:49
389
原创 position 的属性取值有哪些
display 的属性取值有哪些absolute生成绝对定位元素，相对于没有使用 static 的第一个祖先元素进行定位relative相对于原来的文档流位置进行定位fixed生成绝对定位元素， 相对于浏览器窗口进行定位static默认值，没有定位，正常文档流位置呈现inherit继承父元素的定位属性...
2021-05-13 17:35:18
181
原创 导入CSS样式中 link 和 @import 的区别
导入CSS样式中 link 和 @import 的区别1、link 没有兼容性问题，import 在 CSS2.1 之后定义，低版本浏览器不支持2、link 除了加载 CSS，还可以有一些事务操作，@import 只能加载 CSS3、link 是属于 HTML 标签，而 @import 属于 CSS 范围4、link 可以通过 JS 对 DOM 元素进行操作改变样式， @import 不行5、link 可以一边载入页面一边加载 CSS， @import 只能在页面完全载入之后加载...
2021-05-11 18:32:34
165
原创 怎么用 CSS 画一个三角形
怎么用 CSS 画一个三角形此文章参考自这篇博客（点这里）https://www.cnblogs.com/wangjiachen666/p/9462837.html第一步： <div class="triangle"></div> .triangle { width: 100px; height: 100px; border: 100px solid #000; borde
2021-05-11 17:18:15
205
原创 用 position 实现上下左右居中
用 position 实现上下左右居中 <div class="father"> <div class = "child1"></div> </div> .father { border: 10px solid black; overflow: hidden; height: 500px; }
2021-05-11 12:05:19
2180
原创 获得宽高的各种方式
获得元素宽高的方式1、dom.style.width/height<div class = "child1" id="child1" style="width: 100px;"> 获取宽度：var ele = document.getElementById('child1');console.log(ele.style.width); //100px这种方法只适用于内联样式，如果在 css 中设置 width 是获取不到的2、window.getComputedStyle(
2021-05-09 21:44:03
437
原创 css 中的 box-sizing
此处总结一下 box-sizing 分别等于 content-box 和 border-box 值时的区别1、border-box如下在父容器中写了两个孩子 div <div class = "father"> <div class = "child1"></div> <div class = "child2"></div> </div>样式如下 .
2021-05-09 20:24:44
599
原创 怪异盒子模型和标准盒子模型的宽度计算
一、标准盒子模型由上图可以看到，width 只为盒子中内容 content 的大小，所以整个盒子的宽度可以计算为 width + padding（左右） + border（左右） + margin（左右）二、怪异盒子模型由上图可以看到怪异盒子模型中，width 为 content + padding（左右） + border（左右），因此整个盒子的宽度为 width + margin（左右）...
2021-05-09 19:52:34
3449
2
原创 严格模式和混杂模式
严格模式和混杂模式文章目录严格模式和混杂模式一、DOCTYPE的作用二、严格模式三、混杂模式四、如何区分严格模式和混杂模式五、意义一、DOCTYPE的作用定义在 < html > 标签前面，用于告诉浏览器以什么模式渲染文档二、严格模式以浏览器所支持的最高标准来渲染，标准模式，按照W3C标准解析代码三、混杂模式称为怪异模式或者兼容模式，指浏览器根据自己的标准来解析代码四、如何区分严格模式和混杂模式1、文档包含严格的DOCTYPE，一般以严格模式解析2、DCTYPE不存在或者
2021-05-09 19:31:03
632
原创 如何禁用 href 跳转页面
禁用 href 跳转页面点击下面这个 a 标签可以跳转到对应的百度搜索页面<a href="https:/baidu.com"> a标签 </a>但像如下这种写法，将跳转的位置置为了空，就不会跳转了<a href="javascript:void(0)"> a标签 </a>...
2021-05-09 17:03:54
886
原创 行内元素和块级元素分别有哪些？
行内元素和块级元素分别有哪些？行内元素：< a > 、 < em > 、 < strong > 、 < span > 、 < i > 、< label >、 < br >块级元素：< div > 、 < p > 、 < h1…6 > 、 < ol > 、 < ul > 、 < table > 、< form >内联块级元素
2021-05-09 16:40:47
2504
原创 label标签的作用—— for
label标签的作用—— for简单举个栗子男<input type="radio" name="sex" id="male"/>女<input type="radio" name="sex" id="female"/>运行如下，当我们点击任意一个小圆点，就会有选中效果但我们可以看到，想要通过点击文字选中是不行的于是像下面这样，我们在文字上添加 label 标签，并用 for 来绑定相应的 input 标签中的 id例如下面的 for=“male” 中的 male
2021-05-09 12:43:43
612
原创 js中Array类型重排序方法
js中Array类型重排序方法这里讲到的重排序方法有 reverse 和 sort 两种方法，主要简单解释 sort 方法的比较原理先从栗子入手吧~这里有两个数组var num1 = [ 4, 3, 2, 1, 0 ]var num2 = [ 0, 1, 25, 9, 5, 2 ];一、reverse方法console.log(num2.reverse()); //2,5,9,25,1,0reverse方法主要用于反转数组，将数组倒叙输出二、sort方法console.log(n
2021-04-20 19:03:40
329
原创 js中逻辑与的短路操作特性
js中逻辑与（&&）的短路操作特性举个栗子更好理解：在下面的代码块中，会出现报错的问题 var num1 = true; var result = (num1 && num2); console.log(result); //报错但当我们将 num1 改成 false 时，像下面这样，就会输出 false var num1 = true; var result = (num1
2021-04-13 17:35:33
298
原创 Number()、parseInt()和parseFloat()的转换规则
Number()、parseInt()和parseFloat()的转换规则红宝石书学习笔记以下每条后面都标注了输出结果并有相应的规则写出 //Number 的转换规则 //相对复杂、不够合理 console.log(Number(" ")); //0 console.log(Number("")); //0 console.log(Number(true)); //1
2021-04-13 10:56:32
160
原创 常见的数据类型转换为布尔值的转换规则
常见的数据类型转换为布尔值的转换规则来自于javascript高级程序设计一书的学习笔记数据类型转换为true的值转换为false的值BooleantruefalseString任何非空字符串（包括中间仅有空格的字符串" "）“”（空字符串）Object任何对象nullNumbert任何非 0 数字0 和 NaN...
2021-04-12 20:54:53
737
原创 js 中未初始化的变量会自动被赋予 undefined
js 中未初始化的变量会自动被赋予 undefined先来看一个栗子var mesg; //初始化mesgconsole.log(mesg); //undefinedconsole.log(typeof(mesg)); //undefinedconsole.log(typeof(a)); //undefinedconsole.log(a); //报错在上面这个栗子中，初始化了mesg，但并没有赋值，因此两次输出都是 undefined；而 a 没有被初始化过，也自动被赋予了 un
2021-04-12 20:28:08
730
原创 noscript的简单使用
noscript的简单使用一、noscript什么时候生效二、举个栗子一、noscript什么时候生效1、浏览器不支持脚本时2、浏览器支持脚本，但脚本被禁用二、举个栗子<html> <head></head> <title>noscript解释</title> <body> <noscript> <p>此页面需要浏览器支持javascr.
2021-04-10 22:30:40
1226
原创 变量提升简单举例
变量提升简单举例 console.log(num); //输出undefined var num = 1; //初始化num console.log(fn()); //输出 hi变量提升 function fn() { //声明函数 return "hi变量提升"; }输出结果：在上面这个简单的栗子中，最开始解析时，只是创建了num，但并不会给他赋值，但是函数声明会被提升，以上相当于下面这种顺序：
2021-04-02 20:18:09
143
原创 从一个数组中找出两个元素相加等于目标数字，时间复杂度为O(n)
从一个数组中找出两个元素相加等于目标数字，时间复杂度为O(n)文章目录从一个数组中找出两个元素相加等于目标数字，时间复杂度为O(n)一、题目描述二、解题思路三、代码实现一、题目描述从给定的数组中，找出两个元素相加等于目标元素，每个元素不能重复使用，并且时间复杂度等于O(n)数组num[2, 3, 6, 1, 4, 7, 5, 1]目标数为：7输出：[1, 6][2, 5][3, 4]二、解题思路对数组进行升序排列设 i 从前开始往后加 1，设 k 从后往前减 1当下标为
2021-03-31 22:29:36
656
原创 交换长数字中数字的顺序使得长数字为最大值
交换长数字中数字的顺序使得长数字为最大值文章目录交换长数字中数字的顺序使得长数字为最大值一、题目描述二、实现思路二、代码示例总结一、题目描述给定一个数字，仅交换一次使得数字最大——————————输入：3297输出：9237——————————输入：9090输出：9900——————————输入：3000输出：3000二、实现思路将输入的长数字转变为数字数组将数组按照降序排列从头到尾开始遍历原数组和排序后的数组当发现遍历到不同的数字a（小的那个）和b（大的那个）从
2021-03-31 20:38:31
309
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人