- 博客(64)
- 资源 (2)
- 收藏
- 关注
RSS订阅原创 H5电子签名功能
前言 ： 使用canvas来实现手写签名的功能1.准备一张画布 <div class="signature-wrap" > <canvas class="canvas" ref="signCanvas" /> <div class="btn-wrap"> <van-button type="info" block @click="save">提 交</van-button> <van-button
2021-01-26 11:47:01
2902
原创 echarts中双y轴刻度线对齐的问题
splitNumber设置分割的段数，必须一致设置的max一定是大于或等于数据最大值，计算找出数据中最大值向上取整interval强制设置坐标轴分割间隔，控制两边刻度比例一样才能保持刻度线对齐// consumption 和 throughputList 是API返回的数据yAxis: [{ // name: '左轴', type: 'value', min: 0, splitNumber: 5, interval:.
2021-01-07 14:05:25
4894
3
原创 H5与APP混合开发通信交互记录
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题，有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能，丰富你的文章UML 图表FLowchart流程图导出与导入导出导入欢迎使用Markdown编辑器你好！ 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Mar
2020-12-28 09:43:02
724
原创 vue 模拟填空题方格输入（一个文字一个方格）
前言：用于APP、H5的答题功能。题目的数据currentQus:{ questionName: "举头望（），低头思（）。" //标题 rightKey: "明月,故乡", //答案 userKey:"" //用户输入的答案}首先根据标题和答案，处理好格子数，以及每一个方格所在位置，绑定到model，用于页面渲染 /* 处理填空题标题 */ handleBlankTile(currentQus) { const { questionName, rig
2020-12-27 18:02:23
2817
4
原创 JS动静态的概念
对象分两种，一个是类对象，一个是实例对象。静态方法——类对象在构造函数本身上定义的方法，只能通过构造函数本身调用，new出来的对象不能够调用。var SayHello = function (){}SayHello.say = function(){ return "hello";}console.log(SayHello.say()); // hello 动态方法——实例对象它是通过prototype原型对象添加的，所有的实例对象都能够继承调用。var SayHello =
2020-09-01 11:44:50
367
原创 使用echarts模拟立体柱形图
注意：请使用echarts v4.4.0以上版本renderItem 函数提供了两个参数：params：包含了当前数据信息（如 seriesIndex、dataIndex 等等）和坐标系的信息（如坐标系包围盒的位置和尺寸）。api：是一些开发者可调用的方法集合（如 api.value()、api.coord()）。var MyCubeRect = echarts.graphic.extendShape({ shape: { x: 0, y: 0,
2020-05-26 19:40:47
4464
1
原创 JS模版字符串中占位符替换成对象中的key值
getReplaceStr(str, obj) { for (let key in obj) { str = str.replace(new RegExp('\\{\\{' + key + '\\}\\}', 'g'), obj[key]) } return str } let usrIfo = { name:...
2020-05-08 15:05:18
1473
原创 vue+axios封装一个文件流导出
在main.js里全局注册组件import Download from '@/components/DownLoad/index'Vue.component('Download', Download);在app.vue文件中引入<template> <div class="energy-index-wrap qry-index-wrap"> ...
2020-05-02 16:21:51
729
原创 web前端的内存泄漏
JavaScript中的内存泄漏就是被分配的内存没有被使用，但是也不能被回收的一种现象。通俗来说，我们已经无法再通过js代码来引用到某个对象，但垃圾回收器却认为这个对象还在被引用，因此在回收的时候不会释放它，这样导致内存一直被占用，会导致内存不够用而系统崩溃。全局变量全局变量是不可回收的销毁的，所以谨慎使用，如果存入数据过大，可以再用完之后进行清空，设置为null或重新定义。循环引用js有...
2020-05-02 15:27:47
1003
原创 npm配置文件package.json的属性说明
name必须，包名。"name": "Guagua"version必须，包的版本号。"version": "3.7.2"description包的描述。"description": "Guagua"homepage包的官网 url 。author包的作者姓名。contributors包的其他贡献者姓名。license指定一个许可证，让...
2020-04-29 14:56:05
1174
原创 解决el-table表头控制显示隐藏引起的抖动
项目需求表头内容选择项更改为 字段选择，点击后可勾选（多选）控制显示内容问题原因el-table在重现渲染的时候，td（.cell）的高度被重新计算了，整个table的高度就发生了变化，产生抖动的效果解决办法给td固定一个高度其他注意问题表头的控制需要用v-if ，v-show是无效的，原因是v-show不支持 template 语法VUE不推荐v-if和v-for...
2020-04-28 16:03:33
2039
2
原创 el-select实现全选多选
需求：下拉框在实现多选的情况下加一个全选，现实全选反选 <el-select v-model="selectData" @change="handleSelect" collapse-tags multiple @remove-tag="removeTag"...
2020-04-22 20:38:13
3246
原创 常用文件上传限制以及element && element accept上传使用
普通校验上传文件/** 校验上传文件* */export function validUploadFile(type = 'img', file) { if (!file) { file = type; type = 'img' } const fileName = file.name; const m = fileName.match(/\.(\w+)(...
2020-03-24 15:17:15
7906
原创 原生的audio不支持amr音频解决办法
方法一：格式转换（水平和时间有限，而且操作麻烦，暂时放弃）方法二：使用 benz-amr-recorder（推荐）下载和引入（我用的vue所以直接npm）npm install benz-amr-recorderconst BenzAMRRecorder = require('benz-amr-recorder')初始化let amr = new BenzAMRRecorde...
2020-03-05 16:44:08
3122
1
原创 vue $refs 不能动态拼接的问题
项目需求：动态增减表单并验证代码如下： <el-form label-width="110px" :inline="true" v-for="(item, i) in formData" :key="'add' + i" :ref="'addForm' + i" :rules="addRulse" ...
2020-01-16 15:43:42
4507
1
原创 echarts设置容器宽度设置为100%只显示100px宽度
问题：前面的tab栏里面的柱形图表都是100%的宽度，最后一个换成折线图时出现宽度无法自适应的情况。 <div class="environmentChart" > <div class="chart-wrap" id="environmentChart"></div> </div>解决一：通过...
2019-12-13 11:37:51
6340
1
原创 echarts数据变化后，图表不更新
setOption有三个参数chart.setOption(option, notMerge, lazyUpdate...);option—— 图表的配置项和数据notMerge—— 可选，是否不跟之前设置的 option 进行合并，默认为 false，即合并。lazyUpdate—— 可选，在设置完 option 后是否不立即更新图表，默认为 false，即立即更新。正确写法：...
2019-12-10 15:39:29
7293
22
原创 JS数组对象合并之后去重
需求：这是预提交所有挑拨设备页面，点击选择设备打开条件筛选设备。在选择设备页面，选择出需要挑拨的设备，再把已经选择的设备批量添加到预备调拨的列表中，每次批量添加的时候，需要去掉之前已经选择过的设备，避免重复项。解决思路一：连个数组双重循环对比，如果出现相同设备ID就删除掉，然后再连接两个数组，但是觉得麻烦，所以不推荐。解决思路二：先合两个数组，再对数组进行去重。 /* *...
2019-09-17 15:48:21
1388
原创 Syntax Error: Unterminated string constant
Vue 语法错误错误写法<input type="text" v-show="!editShowUp" v-model=" equipmentBaseInfoData.wheelPressure "/>原因双引号不能换行使用，在 Vue2.6.3 以下版本会出现语法错误警告，由于我配置的vs code代码自动格式化问题会出现以上情况，在高版本的Vue中已经解决...
2019-09-06 08:59:50
10013
1
原创 我的程序员养生计划
1. 早起一杯白开水 + 芝麻糊+ 少许主食去超市里面的五谷磨房现磨的芝麻糊，还加了枸杞，这种没有添加剂，大概吃到第三大包的时候明显感觉头发掉的很少了。冲泡的时候先加水，水温不要太高，对清理肠胃比较好，我会加少许蜂蜜，超级好喝。2. 5min拉伸运动就是拉拉腿，拉拉肩膀，伸展一下筋骨，整个人精神气爽的。3. 午饭过后站立20min ，能走动最好拉个小伙伴聊聊天很快就过去了，最好不...
2019-07-08 16:44:57
269
原创 uni-app入门
一、uni-app简单介绍什么是uni-app？uni-app 是使用 Vue.js 开发跨平台应用的前端框架，开发者编写一套代码，可编译到iOS、Android、H5、小程序等多个平台。uni-app的优点跨平台发行，运行体验更好与小程序的组件、API一致；兼容weex原生渲染，增加了开发效率高，但是由于weex坑比较多，建议还是使用局部渲染优化；通用前端技术栈,学习成本更低...
2019-06-26 10:25:48
28793
3
原创 搭建Vue-cli3
一、安装@vue/cli1、载掉旧版本命令：装了旧版本的建议先卸载旧版本，再安装新版本，没有旧版本省略这一步。node版本要在8.9以上。npm uninstall vue-cli -g# ORyarn global remove vue-cli 2、安装cli3命令：npm install -g @vue/cli# ORyarn global add @vue/cli...
2019-06-24 15:29:21
215
原创 ES6之module语法（export和import）
test.js文件中：var testStr='test';export {testStr as str};-----------------------------------------------export var name= 'guagua';模板中：import name from './test.js';import {ms} from './test.js';...
2019-06-05 15:55:03
1383
原创 mpvue修改pages下面的文件以后dist文件不更新问题
我删了一些页面又加了一些页面，重新run了以后发现小程序还是报错中，找了半天发现dist里面pages没有更新，我又试了把dist文件以及node_modules全部删掉重新初始化，还是没有作用最后我尝试了build了一下就成功npm run build...
2019-05-24 15:14:08
1882
1
原创 mpvue引入echarts之后vendor.js文件过大
在build/webpack.base.conf.js下添加：var UglifyJsPlugin = require('uglifyjs-webpack-plugin') new UglifyJsPlugin({ sourceMap: true })完整代码var utils = require('./utils')var webpack = requir...
2019-05-24 14:19:54
1947
原创 Vue引入全局过滤器
创建单独的文件加上时间过滤函数将formatDate 暴露export 出来// 时间戳转时分秒function getformatDate (date, fmt) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.le...
2019-05-16 16:34:52
1213
原创 SCSS 语法
Sass是CSS预处理器，引入了变量、嵌套、mixin（混合）、运算以及函数等功能，且完全兼容 CSS 语法。优点：完全兼容 CSS3在 CSS 语言基础上添加了扩展功能，比如变量、嵌套 (nesting)、混合 (mixin)通过函数进行颜色值与属性值的运算函数库控制指令之类的高级功能自定义输出格式有无数的框架使用Sass构建助于更好地组织管理样式文件，以及更高效地开发项目语法...
2019-04-29 18:07:13
1493
原创 vue集成openlayers
下载依赖cnpm i -S ol创建地图文件 <div class="map"></div>按需引入相应的API，具体查看官方文档<script>import Map from "ol/Map";import View from "ol/View";// 添加图层import TileLayer from "ol/layer/Tile"...
2019-04-28 10:51:29
5884
原创 Vue反向代理
config下面的index.js文件const ios = require('./os');module.exports = { dev: { // Paths assetsSubDirectory: 'static', assetsPublicPath: '/', proxyTable: { '/api': { targe...
2019-04-17 17:18:33
2421
原创 Cesium多图层添加和删除
Cesium中的图层分为两种：普通图层，包含影像、线划等普通显示图层；地形图层，用于真实的模拟地球表面的场景，Cesium会根据加载到的地形瓦片以三维的方式显示出山川、大海等。cesium在viever对象中提供了imageryLayers属性，可以加载多个图层。添加图层叠加图层多次调用就可以了添加其他已知商业地图的图层或者自定义地图，需要做好CORS var oneLa...
2019-04-17 11:44:26
13701
1
原创 JS获取当前时间转为年月日时分秒字符串格式
var now = new Date(); var yy = now.getFullYear(); //年 var mm = now.getMonth() + 1; //月 var dd = now.getDate(); //日 var hh = now.getHours(); //时 var ii = now....
2019-04-17 10:28:32
4081
原创 JS时间戳转日期格式
在公共文件夹中封装@/utils/validate.jsexport function formatDate (date, fmt) { if (/(y+)/.test(fmt)) { fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length)); } let o...
2019-04-09 15:59:12
2073
原创 Vue动态类的几种使用方法
前言：动态类的操作比较简单，但是很实用。一、点击显示或隐藏样式的做法利用带数据绑定<button @click="isShow = !isShow">点击</button><div :class="{ colorRed: isShow }">哈哈哈</div>data() { return { isShow: true}...
2019-04-03 10:20:28
3521
原创 Cookie 和Session、WebStorage
前言：cookie和session都是用来跟踪浏览器用户身份的会话方式。Cookie 由于http是无状态的协议，一旦客户端和服务器的数据交换完毕，就会断开连接，再次请求连接，又需要重新验证，所以必须找到一种方法让服务端记住客户端， Cookie就可以实现这种操作。Cookie 的缺点：数据安全性较低；只能存储字符串；容量限制，约4KB。Session 由于 Cookie...
2019-04-02 11:24:15
143
原创 Vue引入百度地图警告：A Parser-blocking, cross site (i.e. different eTLD+1) script....
控制台警告在vue中引入地图控制台输出：警告出现原因页面渲染以后调用了document.write() ，而这种方式chrome53以上版本是不允许的。警告的用意对于在2G，3G 或者是慢 wifi 环境下面，使用document.write()动态加载资源会让页面的展现慢10秒以上，浏览器可以呈现页面之前，必须通过解析HTML标记来构建DOM树。每当解析器遇到脚本时，它必须停止并执行...
2019-03-27 17:23:30
5440
1
原创 Vue中的slot插槽
前言：之前学VUE对插槽只有一个模糊的存值概念，最近在封装自定义组件时，再次学习一下。通过slot插槽向组件内部指定位置传递内容，通过slot可以父子传参，简化了进行自定义组件的封装和使用。单个slot （默认插槽 或 匿名插槽）就是没有名字的插槽，一个组件里面只允许存在一个匿名插槽。父组件内容 <div class="fa"> <h1&g...
2019-03-26 18:01:38
408
原创 vue弹窗里面使用echarts不显示的问题
出现问题：弹出层中插入echarts图表，没有报错，但是图表加载不出来原因分析：弹出层 的内容是懒渲染的，即在第一次被打开之前，传入的默认 slot 不会被渲染到 DOM 上。弹出层组件会监听 visible 的状态，当状态为 true 时，立刻触发 open 事件，但这个时候 弹出层 的内容还没有渲染。因为 Vue 组件通过 $emit 触发的事件并不是异步执行的，而是同步执行。两种解...
2019-03-25 18:17:16
9653
7
原创 [Vue warn]: Property or method "name" is not defined...
浏览器报错如下：属性或方法“name”不是在实例上定义的，而是在呈现期间引用的。通过初始化该属性，确保该属性在数据选项或基于类的组件中是响应的。解决方案：在data里面添加name : ’ ’ data() { return { name: ' ' }...
2019-03-25 09:37:57
10905
JavaScript权威指南(第6版)
2019-03-14
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人