- 博客(21)
- 收藏
- 关注
RSS订阅原创 做web与移动端vue项目后的思考与总结
做了很长一段时间的Vue项目,现在抽出空来做个小结，以便之后查看，回顾：1.开发规范 对代码风格、命名规则、目录结构进行统一规范。 静态资源的使用规范。 单元测试、提交线上测试规范。 Git 提交记录和多人协作规范。 2.样式 2.1CSS 预处理器的选择 Sass/Scss ✅ Less ✅ Stylus ⭕ 2.2 局部样式与全局样式 局部样式（一般都是使用 scoped 方案）：...
2021-01-05 17:33:36
710
原创 js字符串去重
//核心思想为://使用数组的filter方法过滤掉除第一次出现的字符以外其它字符，然后join连接字符串，s、i、o3个参数分别为：当前字符、当前字符索引、原字符串//此方法妙处在于利用js的call方法改变宿主，使用字符串调用数组中的过滤方法（字符串无此方法），//减少了复杂的循环步骤；并且此方法没有使用多余的变量减少内存开支；//巧妙的利用indexOf取出字符串中第一次出现的字符（非第一次出现的字符被过滤掉）。因而实现。//字...
2020-12-01 13:48:34
2153
原创 深入理解echarts的markline标注线
在移动端需求中，经常遇到echarts折线图需要在折线图的末尾节点添加标注文字，进行显示，是的用户能更加显眼的看到数据分析情况，这就需要使用echarts的markline进行实现：直接贴代码option ={ xAxis: { splitLine: { show: false, }, axisLabel: { color: '#fff', rotate: '35
2020-11-30 15:57:48
25991
6
原创 最全get与post请求的区别
GET和POST两种基本请求方法的区别GET和POST是HTTP请求的两种基本方法，要说它们的区别，接触过WEB开发的人都能说出一二。最直观的区别就是GET把参数包含在URL中，POST通过request body传递参数。基本区别如下： GET在浏览器回退时是无害的，而POST会再次提交请求。 GET产生的URL地址可以被Bookmark，而POST不可以。 GET请求会被浏览器主动cache，而POST不会，除非手动设置。 GET请求只能进行url编码，而
2020-10-27 17:14:56
142
原创 js中this绑定的优先级即指向问题
今天抽空对this绑定进行了整理：this绑定规则优先级上面也说过，这里在重复一下。优先级是这样的，以按照下面的顺序来进行判断:1.函数是否在new中调用(new绑定)?如果是的话this绑定的是新创建的对象；var a = 2;function foo(a){ this.a = a;}let bar1 = new foo(3);console.log(bar1.a); // ?let bar2 = new foo(4);console.log(bar2.a); //
2020-10-20 11:13:53
370
1
原创 求数组最大值及最小值原理解析
求数组最大值可采用apply()方法进行实现：var max=Math.max.apply(null,array)；实现原理是：Math.max不支持Math.max([param1,param2])也就是数组，但是它支持Math.max(param1,param2...)，所以可以根据apply的特点来解决 var max=Math.max.apply(null,array)，这样就轻易的可以得到一个数组中的最大项（apply会将一个数组转换为一个参数接一个参数的方式传递给方法）这块在
2020-10-20 10:59:38
1112
原创 通过css修改border-bottom的长度
在开发过程中经常会遇到容器的宽度为100%，但是却需要他的border为它的长度减去padding之后的长度，通过研究发现可以使用伪类实现该效果，代码如下：.examPaper_header::after { content: ''; width: 100%; height: 1px; display: block; margin: 0 auto; border-bottom: 1px solid rgba(0, 0, 0, 0.09);}...
2020-08-14 17:48:04
12184
1
原创 h5梯形tab实现
在开发过程中，产品提出需要一个梯形tab进行pag的切换，如图所示：在网上也找了很多梯形方案，最后都不适用，故采用如下方法进行实现：1.让ui提供三个梯形图片：左直角梯形，右直角梯形，中间等腰梯形2.通过点击事件切换里面的图形进行显示与隐藏即可html代码如下：<div class='yunying_header'> <div class="header_top_two_tab" data-num='0' style='bo
2020-08-11 14:05:56
1305
原创 h5页面echarts的tooltip属性解析及解决tooltip超出容器的问题
h5页面经常会遇到echarts的需求，这两周在开发过程中发现tooltip在h5页面总是会因为内容过多而超出，特作出如下解决方案： tooltip: { trigger: 'axis', confine: true, // 该属性可使tooltip一直处于容器中 transitionDuration: 0, position: function (point, params, dom, rect, size) {
2020-08-11 13:51:18
1305
原创 解决ios13版本echarts的tooltip在页面滚动时出现白色线条问题
在做开发过程中，发现在ios手机上滑动时，echarts的tooltip会放置在柱子的下层并出现白条，刚开始以为是层级问题，通过给tooltip添加层级进行解决，发现设置层级并不能解决该问题，最后查看api发现可通过设置属性进行实现，解决方案如下：设置tooltip的position，即重置tooltip的位置进行显示，即可解决。position: function (point, params, dom, rect, size) {dom.style.transform = "transla
2020-08-11 13:41:34
729
原创 echarts 滚动组件dataZoom解析之h5自定义dataZoom组件样式
因h5页面需求：需要用柱状图展示一个季度内的数据统计情况，而在手机端，只能采用滚动条进行实现，但是echarts自带的滚动组件在手机端不是特别美观，故对其属性进行修改：dataZoom: [//给x轴设置滚动条 { type: 'slider',//slider表示有滑动块的，inside表示内置的 // startValue: 8,//可用于设置开始显示的柱子的长度 // endValue: 1,//可用于设
2020-08-11 13:33:24
6093
原创 js监听手机物理键返回，并解决ios返回立即执行popstate事件的问题
需求有时候我们在做项目时会碰到这样的场景：返回时到指定的页面，而不是按历史返回但是我们无法阻止用户的行为，用户是有可能会点击浏览器的返回键或者手机物理返回键返回的。解决思路使用popstate事件监听返回pushHistory();window.addEventListener("popstate", function(e) { window.loc...
2020-04-11 14:13:54
1152
原创 webpack的定义及打包原理解析
webpack的定义：本质上,webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。webpack 就像一条生产线,要经过一系列处理流程后才能将源文件转换...
2020-02-26 23:28:29
274
原创 vue的计算属性的使用
vue中通过computed选项定义计算属性 计算属性 类似于 methods 选项中定义的函数 计算属性 会进行缓存，只在相关响应式依赖发生改变时它们才会重新求值。 函数 每次都会执行函数体进行计算。案例实现：输入数学与英语分数，采用 methods 与 computed 分别计算出总得分案例源码：<body><div id="ap...
2020-02-26 21:47:43
4943
原创 echarts的相关属性解读
ECharts，一个使用 JavaScript 实现的开源可视化库，可以流畅的运行在 PC 和移动设备上，兼容当前绝大部分浏览器。底层依赖轻量级的矢量图形库 ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。同时，底层采用canvas画图实现图像的渲染。代码详解：theme = {// 全图默认背景// backgroundColor: 'rgba(...
2020-02-26 21:35:25
356
转载 js获取页面的各种高度大全
1，获取屏幕的高度和宽度（屏幕分辨率）：window.screen.heightwindow.screen.width2，获取屏幕工作区域的高度和宽度（去掉状态栏）：window.screen.availHeightwindow.screen.availWidth3，网页全文的高度和宽度：document.body.scrollHeightdocument.body...
2019-07-17 23:34:51
17505
1
原创 js页面规范基本格式
这是我子工作以来总结的前台js的开发模板，利用闭包的特性很好的避免的页面的全局变量污染/*** 10千伏执行子模块说明*/var createfourltShow= function(name,code,time){//------------------------变量区---------------------------------------//ajax请求根路径...
2019-07-17 23:33:13
1456
原创 Echarts和Easyui实现西安某医院就诊情况统计
主要采用Echarts是西安对数据的可视化管理，包括折线图，柱状图，中国地图等多种展现方式，其中中国地图可实现穿透至省地图进行数据查看功能。截图如下：...
2019-07-17 23:29:34
471
原创 nodejs连接mongodb数据库，通过each对数据库数据进行遍历时报错及解决方案
平常我们用nodejs连接好mongodb数据库后，用find()方法随数据库数据进行查找，然后遍历，进行数据解析，遍历时一般采用each()方法进行遍历，但是有时候可能由于数据库版本和nodejs版本问题，会遍历出错，故提供一下解决方案，如代码所示：each遍历：MongoClient.connect(dburl,function (err,client) { i...
2019-03-05 10:20:14
1477
1
原创 nodejs连接mongoDb数据库得具体操作---增删改查
/*1.安装数据库mongodb 在该项目文件夹下输入npm install mongodb --save即可2. var MongoClient= require('mongodb').MongoClient;//引入MongoClient var assert = require('assert');//用来进行模块调试的 var objectId = require...
2019-03-05 09:58:56
319
原创 Easyui通过两种方式实现复杂表头
一.HTML页面实现复杂表头<div class="data-table" id="center"data-options="region:'center',border:false" style="background-color: #EEEEEE; overflow: hidden; position: absolute; top: 38px; bottom: 0px; w...
2019-01-06 20:42:47
1392
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人