- 博客(26)
- 收藏
- 关注
RSS订阅
原创 JavaScript 各类工具函数[持续更新]
包含时间格式化、判断具体数据类型、表单校验、深拷贝、复杂对象合并、柯里化、提取url参数、时间差、年龄计算、IE环境判定等等等等工具函数
2020-05-13 13:28:46
581
原创 解决：Vant[v2.8.3] NoticeBar 只滚动一次
场景： 使用Vant插件的NoticeBar组件，在浏览器中正常，但在ios微信上只滚动一次。解决： 更新Vant包。经过官网查看源码：最新版本[v2.12.3]的滚动结束事件中，重新开始命令的注释中解释： // using nextTick won’t work in iOS14而我用的版本中，用的就是$nextTick监听的，测试的系统为ios14。后将Vant包更新成了最新版本后解决。...
2021-01-13 11:12:50
1193
原创 解决：JS 手机端LocalDate转string后加了8小时
描述：localDate格式的时间从后台传过来，经过new Date()后，在PC上看是正常的，但是在手机端导致时间在原来的基础上加了8小时。（考虑到项目的体积，不打算装momentJs插件）解决：/* 设定 localDate 字段为后台传过来的时间， 格式为2020-01-01T01:01:03.743212 */const newLocal = localDate.split('.')[0].replace(/\-/g, '/').replace('T', '')const newDate
2020-07-05 17:59:42
579
原创 Element-ui之table封装
二次封装el-table组件，以便使用。包含三个部分：使用说明、创建、引用。前沿：1. 包含：表格展示、分页、数据字典转换展示、时间格式转换展示、数组转换成逗号分割字符串展示、表格内按钮、表格内switch按钮、单选、多选等众多功能。2. 这里设置从父组件中传输过来的对象和数组都用JSON串接收，目的是为了方便监听数值变化。3. 代码为手写，已检查，但不保证没有单词写错，如报错，请检查一...
2020-01-20 17:14:33
1501
1
原创 Element-ui之upload封装
二次封装el-upload组件，以便使用。包含两个部分：创建、引用。说明：1. 包含：组件本身有的各种属性控制、是否拖拽、扩展按钮、上传前的各种校验（图片的话需要压缩）、预览附件（这里支持pdf和图片预览，支持Excel下载，word没写，原理应该和Excel一样，其余的暂不支持）等。2. 这里设置从父组件中传输过来的对象和数组都用JSON串接收，目的是为了方便监听数值变化。3. 代码为...
2020-01-08 10:34:33
2369
2
原创 Vue + pdfJs 预览PDF
简介： vue项目中结合el-dialog组件，以全屏的形式将pdf流通过pdfJs展示出来（如果是本地的pdf文件，则直接拿到本地的pdf文件转化成url嵌入iframe即可，无需pdfJs插件）。原理： 将获取到的pdf文件流文件通过window的createObjectURL方法转换成url，和pdfJs的目录路径拼接成链接，用iframe嵌入的方式展现。步骤：一、创建预览文件。1....
2020-01-03 14:24:12
1855
原创 Element-ui之radio封装
对el-radio和el-radio-group进行二次封装，以便使用。分两步：创建、引用。说明 ：1. 可选项一般是请求数据字典的值以供勾选，假设数据字典的接口为’/getDictionary’，请求参数为code，数据字典中的展示值字段为’label’，选中所传值字段为’value’。2. 也有特定接口请求可选项的，需要指定特定的请求接口url、参数和展示的value和label值。...
2019-12-31 18:41:35
1910
原创 Element-ui之select封装
二次封装el-select组件，以便使用。包含两个部分：创建、引用。说明 ： 下拉选项框一般是请求数据字典的值以供选择，假设数据字典的接口为’/getDictionary’，数据字典中的展示值字段为’label’，选中所传值字段为’value’。也有其余接口请求下拉选择的，需要指定特定的请求接口和展示的value和label值。一、创建公共组件vue文件 — comSelect.vue:&...
2019-12-31 10:17:33
3887
2
原创 Vue （用javaScript/JS）调用媒体摄像头拍照扫描银行卡
概述：在Vue中调用摄像头拍照进行银行卡识别。流程：vue中调用媒体摄像头（无前后摄像头切换功能）——>根据规定的框（前端自己定制）放置银行卡——>将识别的图片通过接口传到后台，后台识别出返回给前端银行卡的相关数据。原理：调用媒体摄像头，应用的是navigator.mediaDevices.getUserMedia功能(API网站)调用摄像头拍摄视频流，将录像流放到vid...
2019-08-23 18:06:55
4680
9
原创 el-upload用代码手动删除附件
this.$refs.upload.abort(file) // upload: el-upload的ref值；file:File类型，file文件本身fileList.splice(fileList.indexOf(file), 1) // fileList: 文件列表，钩子函数中的fileListthis.onRemove(file, fileList) // 调用钩子函数on-remov...
2019-08-13 15:27:37
4082
原创 Element-ui Tree 详解：懒加载与非懒加载、选择框、节点刷新（手动刷新）、树数据封装、展开选择节点所在树
概述：对Tree的懒加载与非懒加载进行分析，进行某个树节点的刷新，在单选、多选下对树进行初始化反选并展开选择节点等。一、对Tree是否懒加载说明：1.懒加载：Tree的懒加载，用一个属性控制：lazy。使用lazy，就要使用load来加载数据进行渲染树。1-1.原理：初始化触发load函数先加载初始数据，通过点击某个节点，触发load函数，来加载这个节点下的子节点。1-2.比较适合...
2019-08-09 11:24:36
6898
1
原创 Vue + Element-ui upload 上传前压缩图片
场景：在Vue项目里，利用ElementUI的upload组件，上传图片，在图片上传前，对图片进行压缩。做法概述：在before-upload方法中对图片文件进行处理，并返回处理后的文件。本人查看了一下upload的源码，发现，beforeUpload方法中，除了可以返回图片校验时的true/false，还可以以return new Promise的方式返回文件，如返回文件，则上传时，以返...
2019-07-08 11:47:28
9383
27
原创 解决：Vue2 +Elementui+dll-webpack项目tooltip和table中的show-overflow-tooltip无效
描述：在Vue+Webpack项目中，使用ElementUI插件时，toolTip使用时并不显示，在table中的show-overflow-tooltip使用，超出部分直接超出，既不显示省略号，鼠标浮上去后也不显示tip提示文字，开发和打包后都不行。分析：经查看，table中的show-overflow-tooltip应用的也是tooTip，归根结底，还是tooTip不显示，可按照这个方向找...
2019-06-28 11:59:59
2373
1
原创 Vue CLI 3（三）—— 配置不同环境下数据请求域名，即axios的baseUrl
前面讲完了vue cli3的相关配置，现将数据请求域名配置单独拉出来讲。vue的配置里vue.config.js中相关的教程有讲过，开发环境下，配置后端API 服务器，可使用devServer.proxy。但通常情况下，项目在开发环境下请求的接口地址和生产环境下的不一样，需要根据不同的环境，切换不同的接口地址域名。上篇文章中，本人直接配置在了api.js中：axios.default...
2019-03-05 14:04:24
14763
4
原创 Vue CLI 3（二）——VUE项目配置
接上篇文章（过去了太久了，唉），在搭建好了新的Vue的框架并成功运行起来后，开始进行相关的配置和项目开发。配置之前，需要将官网教程看完：Vue Cli3教程；相关配置参数。一、根据官网教程，一些需要手动的配置，要自己建一个名为vue.config.js的文件来覆盖默认配置，这个配置文件网上都有的，这里列出我自己的配置文件：/** * vue.config.js * vue.con...
2019-03-01 18:12:45
491
原创 Vue CLI 3（一）——从卸载Vue CLI 2开始搭建新VUE项目并同时使用Vue CLI 2
Vue CLI 3问世后，因为公司项目紧张，一直没有机会学习。在项目上线后，本人终于抽出时间来自学一下。下面记录本人从卸载Vue CLI 2更新Vue CLI 3开始，一步步搭建VUE项目，并同时能用Vue CLI 2 启动Vue CLI 2搭建的项目。注：本人电脑MAC。一、卸载Vue CLI 2，安装Vue CLI 3：1.关于旧版本：Vue CLI 的包名称由 vue-cl...
2018-12-17 13:38:47
1178
原创 Moment.js获取当前月份所在季度的开始结束日期
需求：获取当前月份所在第几季度，并计算出本季度的开始、结束日期。技术：Moment.js说明：在网上找了一下，没发现直接获取的办法，故自己整合了一下。实现：一、获取当前所在第几季度（Moment.js官方文档有的），当前年份：let currentQuarter = moment().quarter() // 当前是第几季度let currentYear = moment(...
2018-12-17 13:37:35
3954
原创 jPlayer插件的使用
本文讲一下本人在使用jPlayer插件时的整个过程、出现的BUG已经解决办法。 最近在做bootstrap项目，项目中需要一个响应式、兼容IE7的视频播放插件，经过上网查找，找到了所谓可以兼容到IE6的响应式视频播放插件——jPlayer。注：本代码的功能是打开自动循环播放，如果不需要，可以修改个别属性。一、下载插件包。官网下载插件包：点击打开链接，这种网站当然有中文版：点...
2018-12-17 13:36:25
776
原创 Mac给Linux服务器安装tomcat
目标：用Mac连接Linux服务器，将tomcat安装成功。前提需要软件：jdk。步骤：一、去官网下载tomcat，以64位Linux服务器，8.5.11版本的tomcat为例。二、将下载的文件上传至服务器（连接、上传文件至服务器已经在之前的一篇文章里讲过了，这里就不讲了）：在“/usr/local”目录下新建tomcat文件夹，将上传好的文件移动到/usr/local...
2018-12-17 13:33:44
223
原创 Mac给Linux服务器安装nodeJs
目的：用Mac电脑给不能连网络的Linux服务器安装nodeJs并将nodeJs的权限设置为全局。一、去node官网下载nodeJs安装压缩文件，以64位Linux服务器为例。下载完成后，将安装包传到Linux服务器随便你想放的目录里上，并将其解压（我的上一篇文章讲过上传解压的过程，这里就不讲了）。二、设置全局。解压完成后，进入相应的目录，查看其版本（我将其放在了服务器的/ro...
2018-12-17 13:32:02
183
原创 Mac连接Linux服务器并上传、解压文件
由于工作原因，要求在Linux服务器没网络的情况下部署项目——首先我要做的是将相关文件上传至服务器。我在网上搜了很多相关资料，结合自身实际情况，整理出我所做的步骤，以供参考。目的：Mac连接上Linux服务器，并将文件上传至Linux服务器，解压。一、Mac连接Linux服务器我所用的工具是iterm2，也可以使用Mac自带终端工具。输入命令来连接Linux服务器：...
2018-12-17 13:30:16
635
转载 jquery实例：让DIV移动到指定的位置标签后面
一个jquery里的简单实例，操作DIV移动到指定标签的后面：假设网页中有以下几个DIV：<div id="1">1</div><div id="2">2</div><div id="3">3</div>如果我让要让id为1的DIV移动到ID为3的DIV后面，可以用下面的
2018-12-17 13:28:28
3567
原创 jQuery根据元素属性获取div
在编码过程中有时候需要根据div的一些属性去找到符合属性的div，此时可以提前给div自定义一个属性并赋值，根据此属性来查找div。例如，给div一个自定义的属性：tip 。<div class="myclass" tip = "thistip"></div><div class="myclass2" tip = "twotip">&
2018-12-17 13:26:29
4316
原创 jQuery加载全部页面完成前的loading效果
此效果的原理：在页面加载完成前在整个页面上边覆盖一层，即loading层，等到页面加载完成后，将loading层隐藏。此效果的HTML代码部分：在整个代码前，添加div，即loading层（可以添加load的图片，也可以当做背景图写在css里）<div id="loading"> <img src="images/loading.gif" alt="loading.....
2018-12-17 13:24:48
9487
原创 angularjs获取前一个网页以及现网页网址的路由信息
angularjs获取当前网址或者前一个网址中的ID、后缀名（name）等路由信息，在引用方法前，要在controller里面声明相关参数：app.controller('caseNavCtrl', ['$scope', '$state''$rootScope', function($scope, $state, $rootScope){}]);在这个controller里面写入下边代码：...
2018-12-17 13:23:13
1673
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人