Dlow--CSDN博客

原创 excel表格数据渲染到页面上

之前做项目的时候，碰到了一个需求，要求在页面上预览excel表格，但是还不要别的多余的，只要表格内的数据组成的表格，所以就去百度了一下插件，在这里面记录一下。首先下载插件xlsx，或者引入xlsx.core.min.js文件（GitHub下载的）下载链接在/dist/xlsx.core.min.jsnpm install xlsx页面中的代码<template> <div class="wrap"> <div class="home">

2022-03-23 18:20:45 1170 1

原创输入框00，000...，变0，000...1变1

当输入框里面的值为00，000，等多个连续的0时，变成0，多个连续的0后面接数字时，直接变成后面的数字。//这里的inputValue就是输入框里输入的值let str = inputValue.replace(/^0+/,0);str = str.replace(/^0[1-9]/,str.replace(/^0/,''))//最后的str就是处理后的值，直接赋值即可...

2022-03-08 09:41:13 1974

原创 input框禁止输入表情（手动笑脸）

输入框禁止输入表情符号，在这里记录一下页面代码 <el-input v-model="inputValue" @input="inputVal('inputValue',$event)"></el-input>methods中的方法// 禁止input框输入表情 inputVal(type,e){ console.log(type,e,'--------') let reg = /([0-9|*|#]\uFE0F\u20E3)|([

2022-03-04 17:38:57 2829

原创 element-tree搜索展示包含名字的树，同时树下的子集也能展示，并展开

在使用element的组件tree的时候，我们用组件里面的属性filter-node-method就能返回包含搜索名字的树，但是返回的树如果节点下面还有树节点的话，点击是展不开，不显示的，所以这里自己写了一个方法，来记录一下，之前也写过一篇，但是后来我发现之前的文章其实写复杂了，完全不用那么写，所以再写一遍记录一遍。首页是页面的代码<el-tree ref="tree" :data="treeListData" :props="props"

2022-03-04 09:50:18 1621 2

原创 js前端导出.zip二进制流压缩包

前几天做的导出.zip格式的二进制流压缩包，在这里记录一下，方便以后使用。axios中请求接口代码如下exportDetail(param) { return Fetch({ url: '/purchaseOrder/exportDetail', method: 'post', data: param, headers: { // 这里需要使用form-data格式数据发送请求 "Content-Type": " applicati

2021-12-30 16:12:12 3393 2

原创 element筛选树，同时展示树下面的子集

之前做的一个项目的需求，在用element的树组件时，需要筛选功能，并且匹配的节点下面的子集也要展示出来。树组件原来的筛选方法只能展示匹配到的节点，节点下面的子集不会展示出来，在这里记录一下。页码代码如下<el-input placeholder="输入关键字进行过滤" v-model="filterText"></el-input><button @click='search'>搜索</button><el-tree ref='t

2021-12-30 14:54:58 1335

原创零宽断言获取路径参数值

前几天写项目时，有个需求，一个校验由字母数字组成的字符串，最少8位，且不能为纯数字或纯字母，当时为了校验纯数字字母百度，看到了之前没用过的js正则零宽断言。我看了一下，然后自己写了一个获取链接上参数值的方法，暂时测着没发现什么问题，在这里记录一下，以后也可以用用第一种这种情况适用例如https://域名/test?name1=value1&name2=value2这样的地址链接function getValue(url,name){ url = url.substr(url.indexO

2021-12-29 14:52:12 143

原创正则匹配至少8位字母数字组合，不能为纯数字或纯字母

前几天做项目，遇见一个需求，用户在输入时要校验是一个至少8位数字字母组成的字符串，同时，还不能是纯数子，纯字母组成，我百度修改了一下，记录一下。let reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{8,}$/?!是零宽断言，意思为“不能是”...

2021-12-24 11:19:55 2707 1

原创 axios接口取消

在项目中，我门经常碰见这样的场景，一个页面有一个tab切换标签，切换不同的标签的时候请求不同的接口，但是如果我们不做处理的话，可能会出现这样的情况，点击一次的时候，请求的接口很慢，然后我们又切换了tab，这时又请求了一个接口，这个接口很快，马上就返回数据了，最后的结果就是数据乱了，不是这个标签下的数据显示在了这个标签下。我之前都是通过判断接口是否请求完毕，加遮罩来防止这种情况的。最近搜索了一下取消请求，按照百度到的操作了一下，发现可行，记录一下。以后可以这么操作一、首先在axios封装文件里加上如下图配置

2021-11-18 11:59:12 2583

原创按拼音首字母排序并分组

把返回的数据，按照拼音首字母排序，并分组，在此记录一下。方法一：所有手机都可用，小程序中也可用，app中亦可用首先建立一个js文件，代码如下let PinYin = { 'a': '\u554a\u963f\u9515', 'ai': '\u57c3\u6328\u54ce\u5509\u54c0\u7691\u764c\u853c\u77ee\u827e\u788d\u7231\u9698\u8bf6\u6371\u55f3\u55cc\u5ad2\u7477\u66a7\u7839\u95

2021-10-15 14:33:45 4114

原创指定js加载顺序函数

js加载顺序一个js文件加载完成后才加载另一个js文件，js相互依赖，可以用下面的函数。//指定加载完js加载function loadScript ( url, callback) { var script = document.createElement("script"); script.type = "text/javascript"; if (script.readyState) { script.onreadystatechange = function() {

2021-08-13 11:56:34 356

原创 vconsole移动端控制台

vconsole使用在index.html里面饮入cdn链接，script里面创建对象就可以了 <script type='text/javascript' src="https://cdn.bootcdn.net/ajax/libs/vConsole/3.9.0/vconsole.min.js"></script><script> var vConsole = new VConsole(); console.log('Hello worl

2021-08-13 11:51:13 139

原创根据拼音首字母排序

在做城市，或联系人右侧快速查找时，我们可以根据返回的数据，把相对应的城市名字，或人员名字传入到下面的函数中，来组装成自己需要的数据类型。function pySegSort (arr){ if (!String.prototype.localeCompare) return null let letters = 'abcdefghjklmnopqrstwxyz'.split('') let zh = '阿八嚓哒妸发旮哈讥咔垃痳拏噢妑七呥扨它穵夕丫帀'.split('') let segs = []

2021-07-26 16:26:26 254

原创 vant上传图片时压缩图片

vant上传图片，有图片的宽高大小限制，可以上传时压缩图片，在这里记录一下。压缩图片大小afterRead(file){ console.log(file,'0000') this.face = []; let canvas = document.createElement('canvas') // 创建Canvas对象(画布) let context = canvas.getContext('2d') let img =

2021-06-22 15:22:42 1400 2

原创项目中js生成二维码

项目中js生成二维码记录这里在项目中使用的是插件vue-qrcode首先npm下载依赖cnpm i @chenfengyuan/vue-qrcode -S然后在入口js，index.js中引入注册import VueQrcode from '@chenfengyuan/vue-qrcode';Vue.component(VueQrcode.name, VueQrcode);项目中使用<qrcode :options="{height:50,width:50}" :value="sc

2021-03-31 09:53:16 280 1

原创导出文件，后台接口返回一堆乱码

当做一个下载文件的功能时，后端返回的可能是一堆乱码，跟后端沟通，看怎么改，我在这里记录一下我当时的修改，机百度到的处理方案首先前端的请求中需要设置responseType:‘arraybuffer’exportManualCashData(params) { return Fetch({ url: '/tmp/exportManualCashData', method: 'get', params: params, responseType:'arraybuffer'

2021-03-23 17:07:21 4015 2

原创 element表格某项文字太多时，鼠标移动时显示更多

element的table组件假如表格某项内容太多时，改成移动鼠标显示更多内容。代码如下 <el-table-column prop="wrongDescription" label="备注"> <template slot-scope="scope"> <div :title="scope.row.wrongDescription" > <el-tag effect="dark" class="myStyle" v-if="sco

2021-03-23 16:57:23 1336

原创简单记录一下sessionStorage,localstorage,cookie的不同

根据自己简单的使用，记录一下发现这三者之间的不同localstorage:localstorage的使用时间是永久的，只要你自己不去删除它，它就永远存在；同时它和服务端没什么关系；相同浏览器不同标签页间（同源）可以共享。sessionStorage:sessionStorage的使用时间是标签页关闭；它和服务器也没什么关系；相同浏览器不通标签页（同源）不能共享，只限于打开的标签页。cookie:cookie的使用时间默认是浏览器关闭，它可以自己设置过期时间；它和服务器有关系，每次发送请求时，在h

2021-03-09 11:27:42 192

原创从window对象里的location路径里，获取需要参数对应的值

记录一下从window的location里获取自己需要的参数值function GetQueryName(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if (r != null) { return decodeURI(r[2]); } return null;}

2021-03-08 14:32:18 637

原创 img的src中填写请求地址

img标签中的src属性，可填写接口地址记录jsp中的img标签的src写请求接口<div class="mCommon_basicThumbnail clearfix marginTop10"> <c:forEach items="${outputModel.orderReFundFileList}" var="file"> <p class="mCommon_basicThumbnail_img">

2021-03-02 10:02:19 7116

原创正则0-1000000

正则匹配0到1000000，最多保留两位小数/(^[1-9]\d{0,5}(\.[0-9]{1,2})?$)|(^[0](\.\d{1,2})?$)|(^[1][0]{6}(\.[0]{1,2})?$)/自己写的，没有发现错

2021-01-05 16:59:50 1284 3

原创 uuid生成记录

uuid生成函数如下createUUID32(){ var s = []; var hexDigits = "0123456789abcdefghigklmnopqrstuvwxyz"; for (var i = 0; i < 32; i++) { s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1); } s[14] = "4";

2020-12-31 11:03:36 109

原创 tinymce富文本使用记录

首先按照网上的教程，在static静态文件夹里新建tinymce，按照网上的教程做就可以。查看链接这里说一下，当时我下载的@tinymce/tinymce-vue是4.0.0的tinymce是5.6.2的，但是用不了，报错，具体报错不记得了，当时没有截图，应该是这样的，然后上网一查，说是兼用的问题，好吧，那我就降级，cnpm install @tinymce/tinymce-vue@3 --save，只写个大版本就可以，最后下载好的如下图static目录如下 tinymce 密码：s1qg在

2020-12-30 17:07:43 339

原创 app中修改title标题

移动端app修改title标题，记录当需要修改移动端的标题的时候，如下图首先在router路由表里添加meta属性，同时设置title为空，这里需要注意，如果title不为空，标题是改不过来的，不知道什么原因，也是公司的大佬教我的。代码如下{ name: 'parityMedicine', path: '/parityMedicine', meta: { title: '' }, component: parityMedicine }, {

2020-11-24 19:54:55 1472

原创记录app中获取版本号

获取app的版本号getAppVerison (expStr) { if (expStr == null) return null; const ua = navigator.userAgent.toLowerCase(); const patt = new RegExp(expStr, "g"); let lastIndex = null; while ((patt.exec(ua)) != null) {

2020-11-13 10:03:22 274

原创 jsp/vue页面通过web页面里的url在项目中找到对应位置

笔记当已知一个jsp的web页面（例图1，图2）的时候，想要在项目中找到对应的文件位置图一图二下面在webstorm中全局搜索ctrl+shift+f,并且右上角的file mask改成*.* 搜索路径名字+"，快速定位，并找到下图如果有多个@requestMapping可以再用同样的方法搜索页面地址栏前面的路径；然后点击进入接着,标记mv找到如下图，到此找到页面，ctrl+shift+o，代开文件就可以了上面的路径找到的是图一对应的项目文件，同样的方法我们接着找图二对应的项目位置：

2020-11-05 11:54:11 7019 2

原创 vue中关于GIF不动的解决办法

vue中关于GIF不动的解决办法首先我也是搜索了导致这个问题的原因，看到网上讲的是因为浏览器的缓存机制；现象就是，GIF图正常img标签引入进入后，页面只动了一次，后面就不会动了。我没有深入的去研究他的起因，下面说下是如何解决的：首先页面的img标签不变，正常引入GIF图片，同时给img标签一个ID，如下图然后设置一个计时器，每几秒钟重新赋值，（里面的方法不用管）如下图到此问题解决,结束语：菜鸟一枚，如果有别的方法可以留言...

2020-11-03 11:43:49 4065 2

qq_24992475的博客