- 博客(53)
- 资源 (5)
- 收藏
- 关注
RSS订阅原创 高德地图热力图问题之重复创建图层
最近这半年新到了一家公司，现在主要在做大屏可视化和小程序这块的业务，最近接到了一个大屏需求，需要用到热力图展示快递揽件的相关数据，一开始想着是用Echarts自带的热力图，去实现，但是领导说我们之前的地图全部是用高德地图去做的，因此被迫营业，开始去学习高德地图API，先把热力图的相关链接给大家安排上有关图层方法的介绍热力图的案例由于当时时间紧张，自己也就没有太去注意一些细节问题。
2023-10-26 17:04:52
7686
1
原创 【H5页面嵌入到小程序或APP中实现手机号点击复制和拨号功能】
在H5界面嵌入到小程序和移动应用（安卓和iOS）中实现手指点击手机号弹出弹窗，包含呼叫和复制选项，是可以实现的。下面我将为你提供一个基本的示例，并解释在小程序、安卓和iOS中要做的支持工作。
2023-08-28 20:13:02
5862
原创 webpack系列一：基础配置
webpack打包工具的基础配置，涉及webpack5和webpack4中的样式文件处理，字体图标文件处理，音视频、Excel和Word等文件处理，eslint语法检查等。
2022-12-09 12:18:34
1080
原创 Vue3.0+ant-design表格自定义展开图标和展开行操作
1. vue3.0+ant-design+TypeScript2. 表格之展开当前点击行，折叠其他行3. 表格自定义展开图标
2022-06-13 11:46:02
3094
8
原创 axios.all()和axios.spread()解决Vue的高并发请求问题
前言我们在Vue项目开发当中经常会遇到一个组件渲染需要的基础数据可能需要向后台发送很多请求，此时，我们一一发送显然是不合理的，一般情况下我们都是使用axios.all()方法进行并发请求处理标准格式这里是在VsCode上敲出axios.all（我装了插件）自动生成的格式，可以看出axios.all接收一个数组参数，并且其是基于promise的我们一般处理并发请求，肯定不是拿到实际返回的数据，一定会对返回数据进行处理，所以axios.spread的作用就是对返回数据进行处理。axios.all([c
2022-04-19 14:33:48
7490
9
原创 读《JavaScript权威指南》（犀牛书）分享
JavaScript词法结构：文本相关：JavaScript将换行符，回车符和回车/换行序列识别为终止符保留字：有些关键字（如let），因为要兼容旧程序不能完全保留。例如在类外部通过var声明的变量可以用let作为变量名，但在类内部使用const声明时不行。Unicode归一化可选的分号，在JavaScript语法中不像Java一样以分号作为语句结束的标志；如果语句以(，[，/，+或 - 开头就有可能被解释为值钱语句的一部分，因此我们在开发中要避免这种情况，但如果有用到，就要在这些语句前面都防御性
2021-12-16 16:39:35
683
11
原创 Syntax Error: TypeError: this.getOptions is not a function
出现问题场景：vue运行项目过程中报错检查代码中并无写错的地方其实涉及到这个问题，就是版本原因了，我安装的 less-loader 版本太高，卸载安装低版本即可npm uninstall --save less-loader // 卸载npm i -D [email protected] // 安装npm uninstall --save node-;ess // 卸载npm i [email protected] // 安装// 如果node-less安装失败，也可以直接在package.json中
2021-11-29 23:59:47
394
4
原创 如何在码云中配置SSH公钥
作为新时代的程序员，git远程仓库和码云是我们经常用到的代码管理工具，对于一个初拥码云的小伙伴来说，大家可能对SSH公钥的配置有点稍不了解，或者平常没有关注到，今天我们就来一起看看码云中怎样去配置SSH公钥。首先，我们要进入码云的官网，去注册一个账号。然后登录进入到下面这个页面，我们点击设置进入下一界面，继续点击SSH公钥这时候会进入到SSH公钥设置界面，如果已经有了，就直接复制使用就行，如果没有就要继续向下操作回来到下面这个页面，这个页面并不会直接告诉我们怎么配置，还需要继续向下点击在新
2021-11-28 21:51:31
549
4
原创 数据可视化----ECharts---地图（七）
数据可视化----ECharts—地图（七）概述地图在我们日常的数据可视化分析中是很常见的一种展示手段，不仅美观而且很大气。尤其是在大屏展示中更是扮演着必不可缺的角色Echarts系列文章标题地址Echarts初体验传送门Echarts通用配置传送门柱状图传送门折线图传送门散点图传送门饼图传送门Echarts官网传送门注意事项一. 使用方式百度地图API（高德地图API）需要申请百度API矢量地图需要
2021-08-29 12:13:32
2872
36
原创 基于token的一个登录与退出组件
笔记1. 登录业务的相关技术点http是无状态的通过cookie在客户端记录状态通过session在服务器端记录状态通过token方式维持状态注意：如果我们的前端和后台接口之间不存在跨域问题，我们一般使用 cookie 和 session 来记录登录状态如果存在跨域问题，我们一般就使用 token 来维持登录状态2. token 原理分析token是保证用户登录成功之后的唯一身份令牌 登录页面输入用户名和密码进行登录 服务器验证通过之后生成该用户的 token
2021-08-26 16:56:40
943
11
原创 数据可视化----ECharts---饼图（六）
数据可视化----ECharts—饼图（六）百度百科——饼图Echarts系列文章标题地址Echarts初体验传送门Echarts通用配置传送门柱状图传送门折线图传送门散点图传送门Echarts官网传送门饼图的基本实现实现步骤一. 搭建ECharts最基本的代码结构（这是实现任何一张图表都必须的第一步）引入js文件（这个js文件可以去官网下载下来）准备一个DOM容器初始化一个echarts对象设置配置项option上面
2021-08-26 12:16:15
22288
37
原创 解决：npm ERR! code ELIFECYCLE npm ERR! errno 1
解决：npm ERR! code ELIFECYCLEnpm ERR! errno 1问题今天在自己学习react时候遇到了一个问题，就是在自己执行npm start运行项目时，产生了如下报错然后我自己稀里糊涂的弄了好几遍，瞎弄一通，只会产生更多的报错。最后在交流群里问了一下自己的师兄，师兄说可能是我无意间动了配置文件，也就是node_modules。解决办法：删掉项目中的node_modules文件夹和package-lock.json文件，网上有很多快速删掉node_modules的指令和方法
2021-08-21 21:10:30
57036
22
原创 数据可视化----ECharts---散点图（五）
数据可视化----ECharts—散点图（五）百度百科上散点图的定义散点图是指在回归分析中，数据点在直角坐标系平面上的分布图，散点图表示因变量随自变量而变化的大致趋势，据此可以选择合适的函数对数据点进行拟合。散点图的特点用两组数据构成多个坐标点，考察坐标点的分布，判断两变量之间是否存在某种关联或总结坐标点的分布模式。散点图将序列显示为一组点。值由点在图表中的位置表示。类别由图表中的不同标记表示。散点图通常用于比较跨类别的聚合数据。案例说明我们本次实现一个小案例是我们用一组数据来证明身高和
2021-08-21 00:25:38
11230
32
原创 数据可视化----ECharts---折线图（四）
引言：ECharts是一款基于JavaScript的数据可视化图表库，提供直观，生动，可交互，可个性化定制的数据可视化图表。ECharts最初由百度团队开源，并于2018年初捐赠给Apache基金会，成为ASF孵化级项目。每篇博客都会强调的事情，学习ECharts最直接、最有效的方式就是去看官网，官网上有你想要的一切，官网地址：https://echarts.apache.org/en/index.html当然了，在下不才，写了几篇拙文，若大家有兴趣的可以瞅一瞅，有帮助的话给个赞，款哥还是会很开心的
2021-07-30 20:11:27
1417
42
原创 数据可视化----ECharts---柱状图（三）
前面两篇博客我写了有关Echarts的一些基础和通用配置项，博客地址在下数据可视化----ECharts初体验（一）数据可视化----ECharts通用配置（二）柱状图柱状图一、搭建基础结构二、配置配置项1. 坐标x轴 xAxis2. 坐标y轴 yAxis3. series （我这里叫它系列）其他操作（这些都是在series里进行配置的）最大值，最小值平均值显示数值柱子宽度柱状图一、搭建基础结构步骤1：引入echarts.js文件<script src="echarts.js文
2021-07-28 21:47:44
1642
32
原创 数据可视化----ECharts通用配置（二）
文不如表，表不如图。上一次，介绍了ECharts的相关概念以及使用步骤，请见数据可视化----ECharts初体验（一）还有一句，就是最好的文档在官网，看谁的博客，都不如去熟读官网，访问官网的方式点击这里点点点官网地址：https://echarts.apache.org/zh/index.html，复制到浏览器打开直接百度，echarts这一次，让我们一起来学习一下，ECharts通用配置ECharts通用配置一 title(标题)text (标题文本)textStyle(文本样式)co
2021-07-27 19:36:14
1749
23
原创 Git常见的一些报错
今天在使用给i他上传项目时，遇到了一些报错，下面做下记录：一. not a git repository (or any of the parent directories): .git翻译：不是git仓库(或任何父目录):.git解决办法：如果是第一次创建，就输入git init 指令，见表格该文件夹初始化为一个本地仓库如果不是第一次创建（一般指我们已经克隆了一个仓库），这时候坑是因为我们没有进入到仓库文件夹，只需进入到仓库文件夹即可我的问题就是第二点，没有进入到仓库对应的文件夹，这时候在
2021-07-27 13:26:59
6395
13
原创 数据可视化----ECharts初体验（一）
引言：当我们做一个后台管理系统时，总有一大堆数据要进行处理，这个时候数据的可视化操作，就显得非常重要，今天让我们一起去学习下ECharts的应用吧。正所谓文不如表，表不如图，把数据用图表的形式展示出来，就是简单的数据可视化。有关数据可视化主要有三种方式：1.报表类 2.商业智能BI 3.编码类我们主要是来学习第三种编码类中的Echarts，官网地址：https://echarts.apache.org/zh/index.htmlECharts 定义：ECharts 是一个使用 JavaS
2021-07-26 23:17:37
1868
56
原创 vue移动端项目使用Swiper那些坑----paginationType&observeParents
项目场景：我在移动端使用了swiper插件来做轮播图效果，ui设计稿上的分页器是分式形式的，但是swiper默认的分页器是一个圆点，我需要修改这个样式，如下图：问题描述：我按照官方文档上所说，分页器样式类型，可选‘bullets’ 圆点（默认）‘fraction’ 分式‘progress’ 进度条‘custom’ 自定义写下了这段代码data () { return { swiperOptions: { pagination: {
2021-07-17 00:16:11
1020
22
原创 vue 移动端 click事件失效问题
vue 移动端 click事件失效问题今天在写项目时遇到了一个狗血又令人头痛的问题，我的点击事件突然之间就不顶用了，但是因为我写的是移动端的项目，我把浏览器运行环境切换到pc端去做了一下尝试，发现这奇葩的点击时间又可以了，怎么搞，搞个锤子，一通百度猛如虎，心情如下经过半个小时的垂死挣扎，我突然间想起来自己使用了一个滚动插件better-scroll，会不会是他的问题呢，去看看官方文档怎么说吧，发现了这个问题问题找到了，那就上代码，哦了this.scroll = new BetterScroll(t
2021-07-15 17:07:54
1291
17
原创 Vue中$emit()方法和props属性的区别与应用
Vue中$emit()方法的应用首先，对于$emit()方法的相关定义，大家请看emit( eventName, […args] )父组件可以通过自定义属性给子组件传值，子组件通过props属性监听父元素传过来的数据子组件可以使用$emit调用父组件的方法并传递数据**ps：**这里我感觉应当是重要的事情说三遍！三遍！！三遍！！！我看了很多人的博客，第一条大家都是写父组件可以使用 props 把数据传给子组件 ，我感觉这句话有失偏颇1.父组件向子组件传值有关props：props只能是
2021-07-12 23:05:42
1411
29
原创 Vue项目中less实现样式穿透
今天在看一个慕课网上的视频时，遇到了一个小问题，问题是在我们使用轮播图插件vue-awesome-swiper时，发现轮播图分页器pagination的当前页的小圆点显示为蓝色，但是设计稿中显示为白色，效果如图因为在当前组件中的样式，我们使用了scoped属性锁定了样式作用域，所以我们要想修改这个样式就需要一些特殊设置，在视频中使用是stylus，所以它使用的是stylus的样式穿透stylus样式穿透 >>> .wrapper >>> .swiper-p
2021-07-07 22:30:08
12134
18
原创 移动端1像素边框的问题
移动端1像素边框的问题-----如果我们的手机屏幕分辨率比较高，是一个二倍屏或者三倍屏，如果我们在页面上去写border-bottom: 1px; 这个时候我们写的是1px，但实际上它是css像素，并非物理像素，我们仔细观察的话，在二倍屏或者三倍屏上它实际上不是1个物理像素，而是两个物理像素或者三个像素的高度，为了解决多倍屏里面1像素边框会被显示成多像素边框的问题，需要引入一个解决方案，这个方案是一个css文件下面是这个css文件的源码@charset "utf-8";.border,.borde
2021-07-05 20:59:41
271
9
原创 字符串String的slice、replace、toUpperCase和repeat等方法会不会改变原有字符串
字符串String的内置方法 1. slice()、substr()和substring() 2. replace() 3. toUpperCase()和toLowerCase() 4. ES6中新增的一些方法repeat()，padStart()和padEnd() 都不会修改原有字符串
2021-07-03 11:06:27
2683
12
原创 Vue版的三级联动
Vue版本省、市、区三级联动对于初次学习前端Javascript的小伙伴来说，三级联动是一个比较复杂的逻辑，有关原生JS是如何实现三级联动的呢，大家可以去看一下我之前写的一篇博客 js原生代码实现三级联动那么我们使用Vue框架要如何实现三级联动呢？关于用Vue来实现三级联动效果，这里其实并没有太大的区别，逻辑都是一样的，难点也仍是在取数据上，我们如何能准确的获取到相应的省、市、区才是问题的关键，具体的DOM元素渲染倒不是什么难题。在写项目之前我们需要引进一下vue文件和数据文件，下面是我的v
2021-07-01 20:35:42
4476
18
原创 前端发送请求的方式
一、form表单提交为了演示下面的案例，我们先用node.js写一个简易式服务器，用来接收前端发送过来的请求//引用模块const express = require('express');创建对象var app = express();// post请求的两种解析方式app.use(express.json());app.use(express.urlencoded({extended:true}))// 设置静态目录app.use(express.static(__dirname+
2021-06-28 21:13:41
4572
14
原创 ES6解构赋值之数组的解构赋值
解构赋值<一>解构赋值是一个JavaScript表达式这使得可以将值从数组，或者属性从对象提取到不同的变量中。 ----MDN<二>下面是菜鸟教程上的解释解构赋值是对赋值运算符的扩展。他是一种针对数组或者对象进行模式匹配，然后对其中的变量进行赋值。在代码书写上简洁且易读，语义更加清晰明了；也方便了复杂对象中数据字段获取。下面是整理的一些数组的解构赋值相关内容1. 简单的解构赋值语法const[ ]
2021-06-26 20:53:22
361
5
原创 面试题：CSS 优化和提高性能的方法
加载性能：（1）css压缩：当项目完成之时，将写好的css进行打包压缩，可以减小文件体积，提高页面加载速度（js文件同理）。（2）css单一样式：当需要给一些集成属性设置某一样式时，单独设置会节省一部分性能，例如：margin，padding，只需要设置上、右时，单独设置margin-top，margin-right要比margin:top right 0 0;节省性能。（3）在引入外部css样式文件时，减少使用@import，建议使用link，因为后者在页面加载时一起加载，前者是等待页面加载完成之
2021-06-25 20:54:57
426
原创 node.js数据库报错Failed to lookup view “list“ in views directory
今天在自己学习回顾node.js连接数据库并将所获取的数据返回给前端界面时，遇到了一个报错Failed to lookup view “list” in views directory，具体报错信息如下图：出错不可怕，让我们来排查一下，来吧，上代码两种修改方式1.我们可以修改view文件下的ejs文件名，使其与代码中render中的第一个参数相同2.我们可以修改代码中render中的第一个参数，使其与view文件下的ejs文件名相同总之，就是让代码中render中的第一个参数与view文件
2021-06-23 10:26:24
1426
原创 TypeError: connection.connect is not a function
今天写node.js操作数据库，在搭建数据库连接时遇到了一个TypeError: connection.connect is not a function，下面是bug的提示内容，如图所示发现这个报错时，第一时间就去找connection.connect，但是没有发现有什么不对，下下签之策 为此我还特意找了找之前的代码比对了一下，下面是当时的思路后来问了下朋友，朋友让检查一下自定义模块PS：盯着瞅了十多分钟没发现错误在哪，此时此刻的自己仿佛是一个弱智后来只能一一排查，发现自己的错竟然是把理应
2021-06-22 21:34:04
5072
原创 javaScript面试题之生成十个按钮，每次点击的时候弹出1-10
一、使用自定义函数for (i = 1; i <= 10; i++) { (function (i) { var btn = document.createElement("button"); btn.innerText = i; btn.onclick = function () { alert(i); } document.body.appendChild(btn); })(i
2021-06-22 09:01:35
629
4
原创 使用PHPstudy开启MySQL服务，并创建一个数据库
大家好，我是一个永远在路上的程序猿，今天给大家分享一下，如何下载使用phpstudy开启MySQL服务，并手动创建一个数据库。第一步：官网下载phpstudy官网地址1.当我们在浏览器地址栏输入上面的网址以后会看到下面的界面在这里我们可以根据自己使用的系统来选择自己需要下载的版本，我这里使用的是Windows系统，点击进入后就可以选择版本进行下载第二步：解压使用1.当下载完成后我们能够在自己的下载路径里找到一个phpStudy.zip压缩包2.我们解压完成后，打开解压后的文件
2021-06-21 21:14:13
8916
原创 let与var的区别，几个经典的小面试题
试判断下面各个小题的输出结果答案以及解释大家可以去看看我下面的一篇博客博客地址：let和var的区别面试题答案第一题：console.log(dog); var dog = "小狗"console.log(cat); let cat = "小猫"第二题：第1组var dad = '我是爸爸！'console.log(dad); var dad = '我才是爸爸！'console.log(dad); 第2组let son = '我是儿子！'console.log(
2021-06-17 21:47:18
260
14
原创 let和var的区别面试题答案
各会输出什么结果，解释下原因第一题：console.log(dog); var dog = "小狗"console.log(cat); let cat = "小猫"第二题：第1组var dad = '我是爸爸！'console.log(dad);var dad = '我才是爸爸！'console.log(dad);第2组let son = '我是儿子！'console.log(son);let son = '我才是儿子！'console.log(son);第三
2021-06-17 20:55:19
367
3
04-出现最多的的字符（2）.html
2021-04-14
获取10-20之间六个不重复的随机整数.html
2021-04-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人