- 博客(99)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 react中useEffect和useLayoutEffect的区别
【代码】react中useEffect和useLayoutEffect的区别。
2023-02-14 17:46:06
778
1
原创 前端如何快速的给写好的html起一个服务
第三步：进入需要起服务的文件夹，执行【http-server】命令，如图。第一步：需要安装node（本地已经安装）第二步：安装http-server，如图。
2023-02-07 16:51:55
749
原创 关于vue中某个页面在刷新的时候报only one instance of babel-polyfill is allowed错误
babel-polyfill
2022-09-21 14:00:51
2106
1
原创 腾讯地图-new qq.maps.place.Autocomplete在弹框中不显示的问题
近期做了这么一个需求：需要在弹框搜索和选取地图定位，然后我发现，使用new qq.maps.place.Autocomplete“不显示”下拉选项的问题如图：刚开始我以为是没有请求到数据，然后看了network，发现是有数据返回的再后来我发现 其实下拉选项是有渲染的最终找到原因是：下拉选项的元素的z-index要低于弹框的zindex，于是把下拉选项的z-index设置的弹框的z-index大就可以了最终效果为：最后附上代码/* eslint-dis
2022-03-21 19:48:27
1600
原创 nvm安装流程、使用nvm安装指定node版本
1.下载nvm 下载地址：Releases · coreybutler/nvm-windows · GitHubnvm-noinstall.zip： 这个是绿色免安装版本，但是使用之前需要配置 nvm-setup.zip：这是一个安装包，下载之后点击安装，无需配置就可以使用，方便。 Source code(zip)：zip压缩的源码 Sourc code(tar.gz)：tar.gz的源码，一般用于*nix系统 使用为 nvm-setup.zip 安装执行下一步直到 fin...
2022-01-14 13:44:16
34247
3
原创 echarts map 获取点击位置的adcode，然后调取接口
this.$nextTick(() => { const _this = this if (this.echartMap) { return } // 获取地图数据 axios.get('/json/eerduosi.geoJson').then(res => { echarts.use([MapChart]) echarts.registerMap('鄂.
2021-11-08 20:06:48
3280
原创 js作用域问题
function fn (a, c) { console.log(a) var a = 123 console.log(c) function a () {} if (false) { var d = 678 } console.log(d) console.log(b) var b = function () {} console.log(b) function c () {} console.
2021-10-14 11:17:31
152
原创 js中的赋值、浅拷贝、深拷贝的区别
浅拷贝：当我们把一个对象赋值给一个新的变量时，赋的其实是该对象在栈中的地址，而不是堆中的数据。也就是两个对象指向的是同一个存储空间，无论哪个对象发生改变，其实都是改变的存储空间的内容，因此，两个对象是联动的。浅拷贝：重新在堆中创建内存，拷贝前后对象的基本数据类型互不影响，但拷贝前后对象的引用类型共享一块内存，会相互影响。深拷贝：从堆内存中开辟出来一个新的区域存放新对象，对对象中的子对象进行递归拷贝，拷贝前后的两个对象互不影响。...
2021-10-12 11:37:25
329
1
原创 重绘与回流
重绘重绘：当渲染树中的一些元素需要更新属性，而这些属性只是影响元素的外观、风格，而不会影响不布局的操作，比如background-color，我们将这样的操作成为重绘。重绘过程：犹豫没有导致DOM集合属性的变化，因此元素的位置信息不需要更新，从而省去布局的过程，流程如下：跳过了生成布局树和建图层树的几个阶段，直接生成绘制列表，然后继续进行分块，生成位图等后面的一系列操作。回流回流：当渲染树中的一部分（或全部）因为元素的规模尺寸、布局、隐藏等改变而需要重新构建的操作，会影响到布局.
2021-09-22 18:02:48
267
原创 浏览器渲染原理
1.浏览器在接收到服务器返回的html页面之后2.浏览器开始构建DOM树，遇到css样式会构建css规则树（CSSOM）3.遇到js会通知DOM API和CSS DOM来操作DOM树和CSS规则树4.解析完成后，浏览器引擎会通过DOM TREE和CSS RULE TREE来构造rending tree5.渲染树构建完成之后进行布局处理，换一种说法就是确定每个节点在屏幕上确切的显示位置6.最后开始绘制，遍历渲染树，并用UI后端层，绘制出每一个UI的节点...
2021-09-22 16:57:02
101
原创 Echarts线形图表根据后端返回的枚举值渲染相应的文案
如：想要将后端返回的0,1在Y轴上和tooltip上显示为对应的停止和运行在设置之前是这样的：在图表设置的option中加上如下配置项option = { // 在tooltip中增加formatter tooltip: { formatter: (params) => { let value = params[0].data let status = '' if (value.
2021-09-08 17:12:15
290
原创 el-tree实现选择父节点其子节点都被选中，取消选中父节点其字节点取消选中，但选择和取消选择字节点并不影响父节点的功能需求
HTML如下：<el-tree ref="tree" :data="treeData" :props="defaultProps" node-key="classification_id" :expand-on-click-node="false" highlight-current check-strictly show-checkbox @check-change="treeCheckChange" @node-click="treeNodeClick" class="mt-10">&
2021-09-02 21:42:33
2447
3
原创 44 道 JS ‘难‘题，做对一半就是高手
来源 | https://www.jianshu.com/p/e161bd720e64国外某网站给出了44道JS难题，试着做了下，只做对了17道。这些题涉及面非常广，涵盖JS原型、函数细节、强制转换、闭包等知识，而且都是非常细节的东西，透过这些小细节可以折射出很多高级的JS知识点。你可以通过传送门（http://javascript-puzzlers.herokuapp.com/）先去测试一下你的水平，然后回来看看我的解析。为了详细解释这些细节，我也查阅了不少资料，弥补了很多JS知识盲点。.
2021-01-26 16:32:01
598
原创 去除某个对象中的 value 为 null，undefined 的 key 写的代码
functionfilterParams(obj){constkeys=Object.keys(obj)keys.forEach(key=>{constvalue=obj[key]if(isObject(value))filterParams(value)if(isEmpty(value))deleteobj[key]})returnobj}functionisEmpty(input){return...
2021-01-26 16:04:18
701
原创 echarts 柱状图 设置y轴最小刻度为1
在没有设置y轴最小刻度时，效果是这样的任务呢，是不会有零点几个的，所以这么做是不合理的，要把Y轴的最小刻度设置为1设置好之后的效果是这样的，这就符合了需求
2020-10-13 15:45:51
5701
2
原创 异步，同步的执行顺序
/***异步队列又分为*微任务：Promise，process.nextTick*宏任务：整体代码script，setTimeout，setInterval*只有微任务队列为空，才会去执行下一个宏任务（这也就是3在1前面的原因）**async本身没有异步和同步之分，只是一个语法操作符，可以帮助解决异步的问题**setTimeoutPromise均属于异步操作*Promise中的resolve和reject还是属于同步操...
2020-09-24 14:44:59
966
1
原创 css 超出部分省略号隐藏，vue打包后css超出2行后省略号隐藏无效
一行隐藏.opm-ellipsis { width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}多行隐藏在项目中遇到了vue打包后css超出2行后省略号隐藏无效的问题，上网扒了一波后，发现还要加上以下属性 display: -webkit-box; -webkit-box-orient: vertical; word-break: break-all;...
2020-09-24 11:05:26
720
原创 async/await 实现异步接口请求操作转为同步
async/await 本质上依然是基于Promise，但在使用上更加简便符合自然习惯。async函数内部同步执行。await之间相当于.then。async函数外部的调用异步执行。需要try/catch await应对promise reject的情况。getUser () { return this.$getAjax('user/list') }, async searchUser () { /** * 输出顺序为 * 1, re
2020-09-24 10:48:55
2187
原创 css: 中的position:sticky
在看这篇微博的时候才发现position原来还有这个属性，感觉很方便https://www.zhangxinxu.com/wordpress/2018/12/css-position-sticky/
2020-09-18 11:00:46
120
原创 git如何把一个分支上的某次修改同步到另一个分支上
https://blog.youkuaiyun.com/toby54king/article/details/105011799
2020-07-28 16:00:48
3690
原创 vue+hbuilderX 实现扫一扫功能
最近项目上有个扫一扫功能，用了很多方法，最终在网上扒到这个最容易、最方便的方法和大家分享一下喽~感谢 https://blog.youkuaiyun.com/qq_35844177/article/details/78951825<template> <div class="scan"> <div id="bcid"> <div style="height:40%"></div> <p class="tip">...载入中..
2020-06-20 17:02:09
3400
1
原创 el-cascader 级联选择器 选择任意一级选项 点击收起，点击label选中
https://www.cnblogs.com/whoamimy/p/12488790.html
2020-05-09 14:34:12
2555
原创 vue以excle格式下载表格数据
// 下载xlsx表格 /** * * @param {* string } domId 要下载table的id * @param {* string} name 要下载表格的name */ downExcel (domId, name) { /* 从表生成工作簿对象 */ var wb = XLSX.utils....
2020-05-08 10:53:31
402
原创 echarts饼图分两行来显示legend
getPirECharts (data) { let name1 = data.filter((item, index) => { if (index < (data.length / 2)) { return item.name } }) let name2 = data.filter((ite...
2020-05-06 16:49:20
5374
原创 echarts柱状图不同的柱子循环显示不同的渐变颜色
getBarECharts (xdata, ydata) { let medicalCare = echarts.init(document.getElementById('medicalCare')) let option = { tooltip: { trigger: 'axis', axisPointe...
2020-05-06 16:47:52
1139
1
原创 vue无缝衔接定时向上滚动滚动
autoLoop () { // 无缝滚动方法 this.right.animateUp = true // 定义的一个变量，用来判断现在是否要添加amit类 setTimeout(() => { this.right.orgAmount.push(this.right.orgAmount[0]) this.right.org...
2020-05-06 16:45:44
1510
原创 js中Date函数获取今天星期几的方法
let d = new Date()d.toLocaleDateString([], {weekday: 'long'}) // 输出星期三
2020-05-06 16:40:22
1572
原创 vue-layer的用法
废话不多说，直接上步骤吧1.先使用命令把vue-layer插件装上 npm install vue-layer2.在main.js中引入layer以及cssimportlayerfrom'vue-layer'import'vue-layer/lib/vue-layer.css'3.在main.js中使用layerVue.prototype.layer=...
2020-04-26 13:48:54
2873
1
原创 vue注册公共多个组件的方法
文件目录如下：commenComponents 文件夹下 index.js代码如下：// 一次引入终身受用/** * require.context()参数的意义 * arg1.在哪里找 * arg2.是否要找子集 * arg3.以什么为规则来找 */const requireComponent = require.context('./', true, /\.vue$...
2020-04-02 16:18:57
2166
2
原创 elementUI写季度选择组件
<template> <el-form> <el-form-item label="日期"> <mark style="position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(0,0,0,0);z-index:999;" v-show...
2020-03-18 14:55:43
2434
2
原创 js数组的find()、findIndex()、filter()、
find()：找到一个合适条件的就返回，不再往下走var people = [{ id: 1, name: 'xiewenting' }, {id: 2, name: 'puxiaoruo'}]var findTest = people.find(item => { if (item.id === 1) { return true }})c...
2020-03-18 10:11:51
490
1
转载 JS数组reduce()方法
arr.reduce(function(prev,cur,index,arr){...}, init);或者arr.reduce(function(prev,cur,index,arr){...},);arr表示将要原数组；prev表示上一次调用回调时的返回值，或者初始值 init;cur表示当前正在处理的数组元素；index表示当前正在处理的数组元素的索引，若提供 i...
2020-03-09 14:01:27
203
转载 JS中的“&&”与“&”和“||”“|”有什么区别？
在JavaScript中“&&”和“||”是逻辑运算符；“&”和“|”是位运算符。四个运算符主要区别是运算方法不一样：1、JavaScript中的位运算符：“&”运算方法：两个数值的个位分别相与，同时为1才得1，只要一个为0就为0。举个例子：31&2 结果为2理由：31的二进制为11111，2的二进制为10 11111&0...
2020-03-09 11:12:59
322
原创 js 关系运算符中特殊的比较原理
1.等同运算符 如果一个操作数的值为undefined，另一个操作数的值为null，则返回true2.等同运算符（1）NaN不会与任何值等同，包括它自己 （2）只有两个操作数引用的是同一个对象、数组、函数时， 才会返回true。如果两个操作数引用的不是同一个对象，哪怕这两个对象的属性完全相同，也会返回false。数组也是如此，只要两个操作数引用的不是同...
2020-03-07 12:31:26
448
原创 ES6中的字符串新方法（padStart()，padEnd(),includes()）
str.padStart(maxLength, arg):如果某个字符串不够指定长度，会在头部补全maxLength，指定字符串的长度。如果当前字符串小于指定的长度，则进行补全；反之，不进行任何操作，返回原字符串。 arg，用于补充的字符串，如果字符串长度过长，则会删除后面的多出的字符串，进行补全。如果不写，默认空格补全。 str为要修改的字符串例：str.padEnd(max...
2020-03-03 14:37:45
289
原创 数组的 reduce 和 filter 与 map 的组合
Array.filter(fn)和Array.map(fn)：用于过滤数组后再重新创造一个新的数组，缺点是过滤的时候需要把数组过滤一遍，用map创造一个新的数组的时候还需要把过滤过的数组再重新走一遍，效率较低。 Array.reduce(fn)：一个函数就完成了上面两个函数所要完成的步骤，且再过滤的过程中就可以把过滤到的数组元素拼接到新的数组中。 如下图：注：两...
2019-12-31 16:28:05
452
原创 数组 find 和 some
Array.some(fn)：当要知道数组中是否存在一个元素时用到，返回一个boolean值，也是和Array.find(fn)最大的区别
2019-12-31 16:27:13
1540
原创 数组 find 和filter
以上两个方法都是通过回调函数进行数据的返回 Array.filter(fn)：在经过回调函数后，返回的是过滤后的仅有符合过滤条件的的数组 Array.find(fn)：在经过调用函数后，一旦遇到满足条件的元素就会返回该元素并不再往下走 如下图： ...
2019-12-31 16:26:30
529
空空如也
nuxt.js中用asyncData 来调取接口，本页面刷新，就会报错。
2019-03-15
TA创建的收藏夹 TA关注的收藏夹
TA关注的人