自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue中使用图片url直接下载图片

vue中使用图片url直接下载图片。

2024-03-29 17:37:40 392

原创 uniapp实现页面固定区域转为base64图片预览并手动保存本地

声明:H5目前没有实现直接长按保存到手机图库(浏览器可以直接保存为图片),所以将过程中得到的base64转为真实图片地址用a标签click的方式实现预览,并手动长按图片来保存。uniapp实现页面固定区域转为base64图片预览并手动保存本地。需安装插件 html2canvas base64ToPath。

2024-03-14 11:37:56 682

原创 vue上传文件夹+上传文件vue-simple-uploader

vue上传文件夹+上传文件vue-simple-uploader。在main.js引入。

2024-03-13 10:26:12 606

原创 upload上传多文件,一个接口同步提交

upload上传多文件,一个接口同步提交。

2024-03-13 10:21:48 407

原创 upload实现大文件切片上传功能

也可以在vue中使用,需要安装插件npm i spark-md5 --save。upload实现大文件切片上传功能(这是个前端小demo)1、建立upload.html。

2022-11-30 17:31:03 369 1

原创 el-upload上传和回显tif图片

主要 :on-change=“changeUpload”el-upload上传和回显tif图片。tif通过链接回显的时候这样处理。

2022-10-10 14:49:21 341

原创 用vue+el-upload+new FormData()实现多图片上传

用vue+el-upload+new FormData()实现多图片上传。

2022-09-02 17:39:07 1641

原创 vue滚动广播

vue中加入滚动广播功能。

2022-09-02 09:54:24 608

原创 js将数组中对象的时间按大小排序

时间大小排序

2022-06-28 15:11:38 483

原创 uniapp制作h5小程序中双列下拉查询

uniapp双列下拉查询

2022-06-28 15:04:13 276

原创 uniapp制作h5端小程序端一键录音功能

一键录音

2022-06-28 14:58:06 1191 3

原创 uniapp开发h5或小程序调用摄像头拍照,录屏

摄像头调用

2022-06-28 14:53:22 3188 2

原创 图表中常用滑动条

图表中常用滑动条dataZoom: [ { show: true, height: 20, xAxisIndex: [0], bottom: 30, start: 0, end: 5, handleIcon: "path://M306.1,413c0,2.2-1.8,4-4,4h-59.8c

2021-12-23 15:53:16 213

原创 js将数组中相同项放在一个数组

js将数组中相同项放在一个数组原本数组长这样:图一想将数组中相同项放在一个数组得到:图二转换中也可以得到:图三方法:sortArr(arr, str) { var _arr = [], _t = [], // 临时的变量 _tmp; // 按照特定的参数将数组排序将具有相同值得排在一起 arr = arr.sort(function (a, b) { var s = a[str],

2021-12-23 15:46:52 6922 1

原创 vue+elementui实现列表播放音频,弹框播放视频,轮播图片,外界地址,富文本内容

vue+elementui实现列表播放音频,弹框播放视频,轮播图片,外界地址,富文本内容

2021-12-17 18:16:14 11450 5

原创 解决el-tree回显时因为父节点id存在导致所有子节点被选中,(目的:呈现出部分子节点选中,父节点半选状态)

解决el-tree回显时因为父节点id存在导致所有子节点被选中,(目的:呈现出部分子节点选中,父节点半选状态) <el-tree :data="permissions" :props="props" :default-checked-keys="empower.defaultKeys" node-key="id" show-checkbox highlight-current defaul

2021-12-03 16:39:51 1088

原创 将base64图片转换为file文件通过接口传递后端

将base64图片转换为file文件通过接口传递后端1、方法dataURLtoFile(dataurl, filename) { //将base64转换为文件 var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1], bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);

2021-09-26 09:41:20 600

原创 vue2.0+electron生成.exe文件

vue2.0+electron生成.exe文件1.安装插件cnpm install electron --save-devcnpm install electron-packager --save-dev2.在package.json中增加指令如图: "name": "ticketing_client", "version": "1.0.0", "description": "A Vue.js project", "author": "‘mengyuntao123’ <‘17

2021-09-15 10:29:18 403

原创 vue中利用富文本编辑器实现将输入文本字符串类型转为txt文件下载输出以及以txt文件格式传递至后端,进行数据交互

vue中利用富文本编辑器实现将输入文本字符串类型转为txt文件下载输出以及以txt文件格式传递至后端,进行数据交互1、安装插件npm install vue-quill-editor --save //富文本编辑器npm install file-saver --save//字符串转txt文件2、main.js引入// 引入富文本编辑器import VueQuillEditor from 'vue-quill-editor'// require styles 引入样式import 'qui

2021-08-17 11:22:10 2211

原创 vue中导入excel文件

vue中导入excel文件1、安装插件npm install -S file-saver xlsx npm install -D script-loader2、在utils中创建excel文件夹放两个js文件第一个Blob.js/* eslint-disable *//* Blob.js * A Blob implementation. * 2014-05-27 * * By Eli Grey, http://eligrey.com * By Devin Samarin, htt

2021-08-16 17:52:40 1178

原创 css+html实现喇叭或者呼吸灯闪烁效果

css+html实现喇叭或者呼吸灯闪烁效果<!DOCTYPE html><html><head> <meta http-equiv="content-type" content="text/html;charset=utf-8" /> <title>呼吸灯</title> <style type="text/css"> /* css代码 */ .breath_l

2021-08-16 17:15:28 986

原创 vue+print.js实现pdf打印预览效果,可实现图表打印效果

vue+print.js实现pdf打印预览效果,可实现图表打印效果1、在utils中新建print.js文件// 打印类属性、方法定义/* eslint-disable */const Print = function (dom, options) { if (!(this instanceof Print)) return new Print(dom, options); this.options = this.extend({ 'noPrint': '.no-print'

2021-08-16 17:12:43 1260

原创 vue+html2canvas+jspdf实现部分内容以pdf形式输出下载

vue+html2canvas+jspdf实现部分内容以pdf形式输出下载1、安装插件npm install --save html2canvasnpm install jspdf --save2、在utils文件夹新建js文件存放以下内容,命名为htmlToPdf.js:/* eslint-disable *///不使用JQuery版的import html2canvas from 'html2canvas';import JsPDF from 'jspdf';/** * @para

2021-08-16 16:10:12 180

原创 小数点后保留两位小数,正则处理输入内容为字母数字,正则处理输入内容为五位数字

小数点后保留两位小数,正则处理输入内容为字母数字,正则处理输入内容为五位数字1、小数点后保留两位小数可用于input框输入function twoclearnumber(value) { if (value) { var f = parseFloat(value); var f = Math.round(value*100)/100; var s = f.toString(); var rs = s.indexOf('.'); if (rs &l

2021-07-14 09:31:25 731

原创 引用基于echarts的中国地图版热力图,地图不出来的解决办法

引用基于echarts的热力图,全国性展示的那种,地图不出来的解决办法首先先看问题图片解决办法1、首先保证安装echarts。2、最重要的一步,在main.js中引入echarts的同时要引入//下边这两行尤为重要,数据才能正常渲染import china from 'echarts/map/json/china.json'echarts.registerMap('china', china)这下再去查看热力图就正常了以为是代码某个地方限制了,巴巴的看了俩小时代码,真的有被累到,原

2021-07-08 11:30:17 1943 2

原创 给内容设置滚动条

给内容设置滚动条例如<div class="wenz></div> .wenz{ width: 56.25rem; height: 35rem; } .wenz::-webkit-scrollbar{ width: 8px; height: 100%; background-color:rgb(29, 16, 16); } .wenz::-webkit-scrollbar-thumb {

2021-07-07 11:01:48 106

原创 elementUI里的table表格,点击行右键出现选择菜单

elementUI里的table表格,点击行右键出现选择菜单(利用连级面板)效果如图<template> <div> <el-table :data="tableData" style="width: 700px" @row-click="clickTableRow" v-loading="loading" border

2021-07-07 09:09:53 2324 1

原创 vue+elementui+minio实现前端直接上传文件到minio服务端存储

vue+elementui+minio实现前端直接上传文件到minio服务端存储呈现如下图:实现方法<template> <div class="minioBox"> <el-button style="marginRight:10px;" @click="getFileName" size="mini" type="success">选择文件</el-button> <input type="file" multiple="

2021-07-06 16:16:23 7412 27

原创 vue适配,在屏上放大缩小内容按比例调整

vue适配,在屏上放大缩小内容按比例调整如图整屏排布,这里以1920屏幕为例屏可视区缩小实现过程1、项目安装插件npm i lib-flexible -Snpm i px2rem-loader --save-dev2、在index.html中更改meta例如:去掉之前的meta<meta http-equiv=X-UA-Compatible content="IE=edge">3、在main.js中引入import 'lib-flexible’4、 在build里的

2021-06-30 15:40:22 2531

原创 将数组转换为供elementui的树形结构识别的数据,并可点击获取选中id

将数组转换为供elementui的树形结构识别的数据,并可点击获取选中id模板中添加树形标签 <el-tree :data="data" show-checkbox node-key="id" :props="defaultProps" ref="treeRef" > </el-tree>方法获取数据data: var arr=[ {id:1,fid:nu

2021-06-18 15:59:42 315

原创 根据系统标准时间获取年月日补零用-拼接

根据系统标准时间获取年月日补零用-拼接 /** * 时间戳转化为年 月 日 时 分 秒 * time: 需要被格式化的时间,可以被new Date()解析即可 * format:格式化之后返回的格式,年月日时分秒分别为Y, M, D, h, m, s,这个参数不填的话则显示多久前 */ formatTime(time, format) { function formatNumber(n) { n = n.toString()

2021-06-17 10:40:52 481

原创 根据两个时间时间戳获取间隔时间小时

根据两个时间时间戳获取间隔时间小时 gettimefl(faultDate, completeTime) { var stime = Date.parse(new Date(faultDate)); var etime = Date.parse(new Date(completeTime)); // 两个时间戳相差的毫秒数 var usedTime = etime - stime; // 计算相差的天数 /

2021-06-02 11:51:12 1021

原创 js获取当前天前几天或者后几天日期

js获取当前天前几天或者后几天日期 // 获取当天前几天 getweilaiday(n){ var n = n; var d = new Date(); var year = d.getFullYear(); var mon = d.getMonth() + 1; var day = d.getDate(); if(day <= n) { if(mon > 1) {

2021-05-06 11:06:57 116

原创 小程序页面传参,参数较多含链接容易解析错误

小程序页面传参参数较多时:传递页面:encodeURIComponent(JSON.stringify(event.currentTarget.dataset.detail))接收页面:JSON.parse(decodeURIComponent(options.arrey))

2021-04-10 14:39:06 128

原创 一个盒子垂直占据剩余空间

想呈现一个盒子垂直占据剩余空间,例如盒子3首先设置盒子1:最小高度保证整屏幕,多余会出现滑动条,整体采用flex布局,改变主轴方向为纵轴只需正常设置盒子2宽高,使盒子3 flex:1,占据剩余内容即可...

2021-03-23 11:14:34 410

原创 element ui 表格动态渲染,列表错乱,横向列表对不齐

使用elementui+vue导致列表出现行错乱问题首先先看问题这里出现折断现象解决办法是:在代码中el-tabel处加入ref之后在动态获取列表数据时添加

2021-03-18 09:38:08 364 1

原创 测试对象中的每个属性的属性值是否都不为空

测试对象中的每个属性的属性值是否都不为空var opt= truevar form={id:1,name:'xx',sex:''} for(let key in form){ if(!Boolean(form[key])){ opt= false //先定义一个opt用它的true,false来判断对象中是否有空数据 return }else{ opt= true } }

2021-03-16 17:02:55 243 2

原创 数组,对象的深克隆问题

首先我要得到的数据长这样如果这样写就会导致在这里使用深克隆改变指针指向就可以实现

2021-03-16 15:54:37 54

原创 根据年月日判断是周几

根据年月日判断是周几getWeekqq(dateString) { var weekDay = ["星期天", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"]; var myDate = new Date(Date.parse(dateString)); return weekDay[myDate.getDay()]},比如参数是“2021-1-3”输出就为当天星期几...

2021-03-10 10:23:53 408 1

原创 获取当前页面链接并截取?后面的参数

获取当前页面链接并截取?后面的参数假如当前链接为 var url = "http://192.168.2.123:8071/museum/explain/getOneByCode?id=A_70"; //当前页面链接获取的id值为

2021-03-05 14:50:50 188

空空如也

空空如也

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

TA关注的人

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