自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(85)
  • 收藏
  • 关注

原创 【VUE】vue后台常用模板

推荐几个基于vue2.0开发的后台管理好用的模板,让需要的人快速获取合适的模板

2019-04-11 15:30:13 95258 41

原创 【JS】json导出到excel,自定义文件名和后缀名

json导出excel表格HTML<el-button type="danger" class="ml10 fr" @click="exportForm">导出表格</el-button>JS表格输出的数字,如果太长,会自动计算,解决办法:在td上加上样式 style=“mso-number-fo

2018-12-03 10:56:38 1388

原创 【VUE】vue3.0后台常用模板

推荐基于vue3.0开发的后台管理好用的模板,让需要的人快速获取合适的模板

2023-03-07 10:34:50 6070 1

原创 【VUE】vue实现登录滑动拼图验证的两种方法,纯前端组件验证以及前后端同时验证

vue实现登录滑动拼图验证的两种方法:第一种是纯前端组件验证,只能区分是人为操作还是机器操作。第二种是前后端同时验证,这种方法加上后端校验相对会更安全一些。1、纯前端组件验证效果如图:原代码gitee链接实现步骤,先npm install:npm install --save vue-monoplasty-slide-verify在main.js引入import Vue from 'vue';import SlideVerify from 'vue-monoplasty-slide-

2022-05-05 16:58:14 14589 23

原创 【小程序】微信小程序使用个性化地图

看开发指南:按照12345点来操作开发指南-入门2、创建应用和key小程序位置服务 - 我的应用选样式地图,绑定创建的key,会带出该小程序信息,保存即可。设置完后就可以使用了!key是腾讯地图key。layer-style属性设置为该key绑定个性化样式的style编号(1,2,3),即可生效 如上图style 1为微信深色样式,那么将layer-style赋值为1。<map id="map" subkey="{{key}}" longitude="116.273

2022-04-24 15:16:53 1609

原创 【小程序】版本发布自动更新机制

如果两次提交的版本号一样, 小程序会不会去更新到最新的版本呢?其实,这并不影响更新机制。你自己的版本号只是备注,审核后微信会有个数字版本号进行对比。根据微信提供的能力,小程序的更新流程大致如下:配置:调试基础库,设置在2.17.0以上。方法:在app.js加上这两个方法,并在onLaunch调用 onLaunch(options) { this.autoUpdate() }, // 版本更新 autoUpdate() { var _this = this;

2022-04-15 09:08:51 1221

原创 【小程序】小程序上使用echarts tooltip不显示x轴的数据,及自定义 tooltip显示

小程序上使用echarts tooltip不显示x轴的数据那就去自定义tooltip的显示!小程序:注意!小程序这里换行用:’\n’tooltip: { trigger: 'axis', // 这里自定义只是为了把x轴的数据也显示出来 formatter:function(datas) { let res = datas[0].name; for (const i in datas){ res += '\n' + datas[i].seriesName + '

2022-01-26 17:52:27 2968

原创 【小程序】微信小程序消息订阅

微信小程序消息订阅小程序文档查看如图:代码: requestMessage() { var tmplIds = '***' // 用户同意的消息模板id,此处用*号代替 // 这里是获取下发权限地方,根据官方文档,可以根据 wx.getSetting() 的 withSubscriptions 这个参数获取用户是否打开订阅消息总开关。后面我们需要获取用户是否同意总是同意消息推送。所以这里要给它设置为true 。 wx.getSetting({ withSub

2022-01-11 18:33:46 623

原创 【CSS】常用的CSS元素伪类选择器以及示例

CSS元素选择器:选择器示例说明:first-child选择某个元素的第一个子元素(IE6不支持):last-child选择某个元素的最后一个子元素:nth-child()[CSS3]选择某个元素的一个或多个特定的子元素(IE6-8不支持):nth-last-child()[CSS3]选择某个元素的一个或多个特定的子元素,从这个元素的最后一个子元素开始算(IE6-8不支持):first-of-type[CSS3]选择一个上级元素下的第一个同类子元素

2021-09-28 15:18:54 431

原创 【小程序】消息订阅requestSubscribeMessage

现在企业主体的订阅消息是一次性的,由于公司需要多次发送消息,却又不符合长期性订阅消息条件,只能每次进行弹出授权。在后台提供消息订阅id后,前端进行授权提示。以下代码适用于有长期性订阅服务id的企业或政府: // 司机 - 消息订阅 requestMessage() { var _this = this var tmplIds = '***' // 用户同意的消息模板id // 这里是获取下发权限地方,根据官方文档,可以根据 wx.getSetting() 的 withS

2021-08-25 11:37:53 5897

原创 【小程序】wx.previewMedia预览图片与视频

小程序官方文档:wx.previewMedia 预览图片和视频自己测试出来的代码实列,查找了一些资料才整理出来的~:var sources = [{ url: '图片链接', type: 'image'},{ url: '视频链接', type: 'video'}]var index = 0var url = sources[index].urlwx.previewMedia({ sources: sources, // 需要预览的资源列表 current: index, //

2021-07-30 22:06:52 6914

原创 【VUE】web高德地图海量点标记,全部居中显示在屏幕中

官方示例中setFitView()对AMap.Marker可以生效,但对海量点标记 AMap.MassMarks 似乎无效Map类有一个方法setBounds也能实现重新调整视角:https://lbs.amap.com/api/javascript-api/reference/map// <script> 中引入高德地图import AMap from 'AMap'var map// 页面上<div id="my-aMap" style="width: 500px;he

2021-07-12 16:41:05 3530 2

原创 【VUE】ElementUI在Dialog上 mouseup在遮罩上时自动关闭弹窗的问题

mousedown在Dialog上 mouseup在遮罩上时自动关闭弹窗的问题总结在vue中使用鼠标事件@mousedown、@mouseenter等失效的解决办法,以及PC端长按实现

2021-07-12 09:41:24 453

原创 【小程序】微信小程序取消全局或单个页面的标题栏

1、取消全部标题栏:在app.json里的window加上:navigationStyle:custom 。顶部导航栏就会消失,保留右上角胶囊状的按钮 "window": { "backgroundTextStyle": "light", "navigationBarBackgroundColor": "#444", "navigationBarTitleText": "小程序名字", "navigationBarTextStyle": "white", "na

2021-06-21 17:30:58 5459 1

原创 【小程序】微信小程序动态和静态修改页面标题

1、静态修改页面标题:{ "navigationBarTitleText": "古诗猜谜"}2、动态修改标题: onLoad: function (options) { wx.setNavigationBarTitle({ title: '古诗猜谜' }) },

2021-06-21 17:17:57 1440

原创 【VUE】请求后台,导出表格

请求后台,导出表格这里的文件导出表格方式是:根据后端返回的值,进行处理下载。(注意后端返回的数据结构,因为会影响到文件流的正常转换,从而导致下载的表格乱码)// 导出表格 downloadExcel() { var that = this this.axios.get('/api/exportExcel', { responseType: 'blob', headers: { token: that.token, 'Content-Typ

2021-06-21 16:04:13 432 2

原创 【JS】图片、视频、文档等文件下载,解决跨域报错问题

文件下载这里的文件,可以包括图片、视频、文档等参数说明:fileUrl:文件服务器的路径(路径后面加上’?response-content-type=application/octet-stream’,可以支持跨域下载)fileName:文件名// 下载文件 downLoad() { const url = fileUrl + '?response-content-type=application/octet-stream' // 支持跨域下载 const name

2021-06-21 15:26:42 2262 1

原创 【VUE】数据绑定,js数组赋值,多处使用时,一处修改,另一处也会被改变

vue中数据绑定,js数组赋值,多处使用时,一处修改,另一处也会被改变问题描述如下:this.A = [1,2,3]var B = this.AB.push(4)var C = this.Aconsole.log(C) 此时的C会得到 [1,2,3,4],而不是 [1,2,3]解决办法:1、this.A = [1,2,3]var B = JSON.parse(JSON.stringify(this.A))B.push(4)var C = JSON.parse(JSON.

2021-04-25 16:09:55 585

原创 【VUE】vue-amap高德地图定位以及文本标注

vue-amap高德地图定位以及文本标注因要求需实现在地图的定位以及该定位的文本标注,所有我看了一下实现的方式有哪些。最后选择了用现成的 vue-amap高德组件 去实现。实现效果如图:实现过程很简单:1.到 高德开发者平台 申请key2.安装vue-amap(官方推荐 npm 安装)npm install vue-amap --save3.使用组件调用地图在main.js引入vue-amap地图组件:import VueAMap from 'vue-amap'Vue.use(Vu

2021-04-11 12:11:22 2899 1

原创 【VUE】vue-element-admin在IE中打开空白问题

一开始没注意vue-element-admin这个比较好用的框架没支持IE浏览器,后来公司要求支持IE浏览器,所以查了一下,其实,实现起来很简单!附带作者兼容说明链接:https://github.com/PanJiaChen/vue-element-admin/wiki原话是这样:由于vue-element-admin项目暂时没有兼容性需求,如有兼容性需求可自行使用babel-polyfill。所以:1、安装babel-polyfillnpm install --save babel-polyf

2021-03-17 17:30:15 1872

原创 【nodejs】nodejs升级版本后,运行项目node-sass会报错的解决办法

node.js下载node.js下载安装,升级版本后,运行项目node-sass会报错,如下图:它告诉你:这通常是因为你的环境在运行“npm install”后发生了更改。运行“npm rebuild node sass”下载当前环境的绑定。让你运行以下命令:npm rebuild node-sass但还是报错:执行命令的时候有时会遇到上图的错误,然后以 windows 平台为例,管理员权限执行以下命令,安装完即可:npm install --global --production win

2020-12-25 17:06:11 1980

原创 【visjs】使用visjs绘制关系图

附上链接:vis网站visjs中文使用说明文档使用步骤:1、安装npm install vis-network2、在页面中引入<div id="mynetwork" class="myChart" :style="{width: '100%', height: '90vh'}"></div>require('vis-network/dist/dist/vis-network.min.css')const vis = require('vis-network/di

2020-12-18 15:17:41 2374

原创 【echarts】echarts绘制关系图

echarts绘制关系图,效果如图,粗麻编写,教程往下看1、vue安装echartsnpm install echarts2、引入echarts3、在VUE页面中编写HTML:<div id="myChart" class="myChart" :style="{width: '100%', height: '90vh'}" />JS:// 数据遍历转换(主要是计算多重关系所显示的不同弧度值) changeData() { var data, linksDat

2020-12-17 16:25:12 7135 2

原创 【小程序】小程序如何获取当前的天气预报

微信小程序使用百度api获取天气信息1、先到百度开放平台http://lbsyun.baidu.com注册并申请ak(百度api教程)注册百度账号,成为百度地图开发者创建应用获取密钥(AK)2、配置环境:在小程序中引入JS模块下载百度地图微信小程序JavaScript API,解压后的文件中有 bmap-wx.js 文件(压缩版 bmap-wx.min.js ),将其拷贝到新建的路径下,安装完成3、设置请求合法域名需要设置请求合法域名,才能正常使用百度小程序 JavaScript A

2020-12-11 17:42:35 1982

原创 【echarts】vue引用 echarts 地图

1、在vue项目中安装echartsnpm i echarts -S或cnpm i echarts -S2、在用到echarts地图的vue单页面中引入:import echarts from 'echarts'import '../../../node_modules/echarts/map/js/china.js'require('echarts/extension/bmap/bmap')3、然后在vue项目中public的index.html中引入:其中的ak,是用百度地图时,

2020-12-11 15:19:59 696 1

原创 【小程序】小程序定时触发器的使用

小程序定时触发器的使用该功能需开发者工具 1.02.1811270 及以上版本方可使用 从开发者工具 1.02.1910182 开始,新上传的定时触发器内支持使用云调用如果想要定时触发云函数!!!需要添加触发器的云函数目录下新建文件 config.json,格式如下:{ // triggers 字段是触发器数组,目前仅支持一个触发器,即数组只能填写一个,不可添加多个 "triggers": [ { // name: 触发器的名字,规则见下方说明 "name

2020-12-10 00:38:26 3076 2

原创 【VUE】将图片的url或file类型转换成base64,并压缩图片大小

话不多,看代码!1、将图片的url转换成base64urlTobase64(url) { var that = this var img = new Image() img.src = url + '?time=' + new Date().valueOf() // 加上时间结尾,处理缓存 //支持http跨域图片。需要后端设置图片支持跨域为*(如果后端不处理,加上这行会无法显示图片,导致拿不到base64) img.setAttribute('crossOrigin', '

2020-11-24 17:26:26 6136

原创 【Webstorm】Webstorm常用快捷键整理

ctrl+D 复制当前行ctrl+X 删除当前行ctrl+/ 注释当前行ctrl+Z 撤回ctrl+C 复制ctrl+V 粘贴ctrl+alt+L 格式化代码 (必记)shift+enter 重新开始一行(无论光标在哪个位置)(必记)shift+tab/tab 减少/扩大缩进(可以在代码中减少行缩进)ctrl+shift+S 文件重命名 (必记)ctrl+alt+s 打开Web...

2020-04-09 11:14:15 506

原创 【VUE】解决IE浏览器无法显示VUE项目的方法

1、ie11打不开vue项目,报错 “对象不支持“addEventListener”属性或方法”在index.html中head标签中加上:<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">这个属性主要是设置浏览器优先使用什么模式来渲染页面的。#代码IE=edge告诉IE使用最新的引擎渲染网页<...

2020-02-25 22:44:00 3795 1

原创 【Webpack】webpack `Invalid Host/Origin header`问题

webpack Invalid Host/Origin header报错问题这是webpack本身出于安全考虑,因为不检查主机的应用程序容易受到DNS重新绑定攻击。但是,在我们的开发环境下,可以禁用掉disableHostCheck这一配置项。在webpack.config.js或webpack.dev.config.js里的devServer加上 disableHostCheck: true...

2020-02-25 16:21:30 691

原创 【JS】input输入框正则

输入大小写字母、数字、下划线:<input type="text" οnkeyup="this.value=this.value.replace(/[^\w_]/g,'');"> 输入小写字母、数字、下划线:<input type="text" οnkeyup="this.value=this.value.replace(/[^a-z0-9_]/g,'');"> ...

2020-01-15 14:41:35 724

原创 【JS】Js二代身份证号码正则验证

Js二代身份证号码正则验证代码:export function checkIDCard(idcode) { // 加权因子 var weight_factor = [7,9,10,5,8,4,2,1,6,3,7,9,10,5,8,4,2]; // 校验码 var check_code = ['1', '0', 'X' , '9', '8', '7', '6', '5', '4',...

2020-01-15 14:36:42 833

原创 【JS】js的urlencode编码

编码内容:var url = '中文' 编码:var UrlEncode = encodeURIComponent(url)解码:var str = decodeURIComponent(UrlEncode)原理:对URL的组成部分进行个别编码,而不用于对整个URL进行编码...

2020-01-09 11:08:51 29717

原创 【VUE】VUE 分环境打包(开发/测试/生产)配置

做个打包笔记,工作比较忙粗糙些,文案相似,方式不同最近要把Vue项目部署到服务器上,在测试好的项目中执行npm run build就开始打包了。但是每次只能打包到一个环境,不同环境需要配置不同的地址,还得手动更改接口的地址,这给部署带来了极大的不方便。下面,我们要自己配置命令来实现分环境打包,项目结构如下:1.在config目录内新建test.env.js文件(要保证和prod.env.j...

2019-12-20 12:17:39 968

原创 【UNI APP】globalData全局变量

uni-app 在app.vue文件export default里面定义globalData,在当前文件(app.vue)里面获取globalData需要用this.$options.globalData获取,其他文件则用getApp().globalData获取。this.$options是用来获取自定义属性在创建全局变量时,也可不用先在App.vue里面注册,在其他文件里面可以直接赋值。...

2019-12-20 09:47:18 1997

原创 【UNI APP】APP版本号对比

APP的版本升级更新,会用到版本号的对比。当后台推送新版本时,我需判断后台返回的版本号是否大于本地的版本号,大于,则进行跳转更新。在util.js里面引入以下方法的代码: /* * 版本号比较方法 * 传入两个字符串,当前版本号:curV;比较版本号:reqV * 调用方法举例:compare("1.1","1.2"),将返回false */ static compare...

2019-12-19 18:07:45 3255

原创 【UNI APP】uni网络请求超时时间设置

uni的请求超时在manifest.json配置相关uni文档:https://uniapp.dcloud.io/collocation/manifest?id=networktimeout如图所示,请求超时的默认时间均为6000毫秒,可根据自己的需求在 manifest.json 的 源码视图 里面更改。设置完成后,服务需重启才能生效! "networkTimeout":{ ...

2019-12-19 17:36:30 5760

原创 vue项目生成二维码功能使用QRCode

1,导入第三方插件npm install --save qrcode2,在页面上引入import QRCode from 'qrcode'html: <div id='code'></div> <canvas id="canvas"></canvas> <el-button @click="uploadQR">下载二维码&...

2019-10-18 14:20:16 783

原创 【VUE】vue axios 设置一个请求的timeout

在VUE中,有一个需求是判断是否有网络,所以要用到超时返回状态。一开始是在请求头header里面设置timeout:5000,只是没有效果,后面在前面加上{body: {}}后,就可以超时返回了。vue请求timeout正确使用:this.axios.post("/app/json", { body: {} },{timeout:5000}).then(res=>{})vu...

2019-08-26 17:16:35 3071 1

原创 【JS】H5打开支付宝

参见 捷径社区: https://sharecuts.cn/app/333206289如何识别二维码拼接以下路径,请查看二维码解析:https://blog.csdn.net/LuviaWu/article/details/98622564在H5,用a标签就可以根据拼接好的路径跳转,就好了var a = document.getElementById('link') a.href = th...

2019-08-09 11:00:22 7081 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除