- 博客(51)
- 收藏
- 关注
RSS订阅
原创 判断数组对象属性值是否相等
最近做一个文件上传批量导入数据功能，但因后台返回的数据没做属性值重复处理，需要前端处理：返回的数据结构如下：，因项目的要求，返回来的所有值都要，所以使用数组的filter，indexOf方法并不能达到预期的要求；解决办法：判断进入else里面就是重复的值；最后得到的效果如下：![在这里插入有防盗链机制,建议将图片保存下来直接上传(img-(在这里插入图片描述)]](https://...
2020-03-11 12:25:15
5673
1
原创 vue3+acro.design 遇到的问题点
a-select 的default-value 传入参数页面无法更新的问题：解决办法：在select中加一个key，值和default-value的值一样<a-space direction="vertical" size="large"> {{ defaultValue }} <a-select :key="defaultValue" :popup-visible="false" :default-value.
2022-03-21 16:29:58
1534
原创 hexo发生error：spawn failed错误的解决方法
解决删除.deploy_git文件夹;依次输入以下指令git config --global core.autocrlf falsehexo cleanhexo ghexo d
2022-01-08 14:45:24
535
原创 文字动态下划线
.textDuration{ display: inline-block; position: relative; pointer-events:auto; &::after{ content: ""; position: absolute; width: 100%; height: 2px; bottom: 2px; left: 0; transform: scaleX(0);
2022-01-05 16:08:14
137
原创 node中使用redis碰到的问题
1.在koa框架中使用redisnpm install redis -S2.redis连接配置注意：这种写法会出现一个bug，如下：看到这个问题让我一直以为服务器中的端口不通，如果碰到这个问题可以先看下redis服务是否启动，redis端口是否添加到防火墙，端口是否添加服务器安全组，（这里我都开放了，却还是出现这个问题），可以使用下面的命令测试redis是否可以连接成功telnet [服务器ip] [服务port]eg: telnet 25.36.123.9 6379在把这些问题排查后
2021-12-01 16:55:00
1134
原创 vue给window添加监听scroll失效问题
背景：使用element-plus插件时，有个元素设置了overflow:auto，导致滚动的并不是window，而是这个元素未生效写法： const handleScroll = () => { let scrollTop = window.pageYOffset console.log(scrollTop) //scrollTop一直为0 state.isVisible = scrollTop > state.visibilityHeight;
2021-09-16 12:31:17
649
原创 vue:分页跳转页面详情，返回记住当前点击第几页
背景：项目中从列表页跳转到详情页返回的时候会默认跳转到分页的第一页，不利于用户的体验，所以需要返回到当前页实现方法：方法一：Vue2提供了组件级路由钩子函数，分别是beforeRouteEnter，beforeRouteUpdate，beforeRouteLeave这三个钩子函数在这里使用的是beforeRouteEnter，代码如下： beforeRouteEnter(to,from,next){ next((vm)=>{ //参数vm就是当前组件的实例。 console.
2021-08-07 16:21:41
4197
5
原创 Echarts---折线图配置
var optionTutorTable = { title: { text: '教师实时课时数据统计折线图' }, tooltip: { trigger: 'axis' }, legend: { data: ['邮件营销', '.
2021-07-31 11:18:40
403
原创 Echarts饼状图设置
//数据 var workList = [ { name: '李晓燕', value: '120' }, { name: '魔尊', value: '220' }, { name: '天蓬', value: '220' }, { name: '景天', value: '180' }, { name: '雪见', value: '100' }, {..
2021-07-30 16:54:31
690
原创 js：静态文件转换成base64
背景：上传图片需要是base64格式代码：第一次转换得到base64为空值 var imgFile = new Image() imgFile.src="./ceshi.jpeg" //转base64 var canvas = document.createElement( "canvas" ); canvas.width = imgFile.width; canvas.height = imgFile.height; var ct
2021-07-30 12:00:03
340
原创 vue.config.js 配置webpack打包
背景：项目之前配置的打包文件太多，体积太大，需要给他进行优化代码如下：const webpack = require('webpack')const time = Date.now()const path = require('path')// gzip压缩插件const CompressionWebpackPlugin = require('compression-webpack-plugin')// 代码打包之后取出console.log压缩代码const TerserPlugin
2021-07-28 10:45:16
935
原创 jq：分页加省略号
背景：项目中需要重写一个分页功能代码： //重绘分页 var redrawPaging = function (pageSize, pageIndex, total) { //debugger var num = parseInt(total / pageSize) + (total % pageSize == 0 ? 0 : 1); Config.pageCount = num;
2021-07-24 10:20:47
453
1
原创 jq 修改元素css伪类样式
css伪元素是什么： CSS 伪元素用于向某些选择器设置特殊效果。伪元素有哪些： :first-line 伪元素："first-line" 伪元素用于向文本的首行设置特殊样式。 :first-letter 伪元素："first-letter" 伪元素用于向文本的首字母设置特殊样式。 :before 伪元素：":before" 伪元素可以在元素的内容前面插入新内容。 :after 伪元素：":after" 伪元素可以在元素的内容之后插入新内容。例子：.legend-cust
2021-07-23 14:44:14
1404
原创 Bootstrap：模态框（Modal）一些使用
1.打开模态框$("#allot_Qa").modal("show") //allot_Qa定义的模态宽ID2.禁止点击模态框空白区域关闭 $("#allot_Qa").modal({ backdrop: "static",//点击空白处不关闭对话框 show: true });```3.模态框打开前（可以处理模态框打开之前的一些操作）$("#qa_teacher_select").on(“shown.bs.moda
2021-07-02 12:12:25
604
原创 jq：使用dataTable插件无法重复请求问题
在项目中使用dataTable插件来实现表格，但是在进行tabs切换时，dataTable不能够重复发起请求function getList(type) { Config.grid = new Datatable(); Config.grid.init({ src: $("#tableTeacherQA"), onSuccess: function (grid) {
2021-07-01 15:33:37
163
原创 js实现图片的预览
1.html代码<label for="officeId"> Replace <input type="file" style="display: none;" name="TeacherCertificate" multiple accept=".png,.jpg,.jpeg" id="officeId" placeholder="replace" />
2021-06-24 21:04:31
568
原创 css实现分割线
1.分割线实现通过after和before伪类实现分割线代码如下 .company-head { position: relative; } .company-head:before, .company-head:after { content: ''; position: absolute; top: 27%; background: #666;
2021-06-18 17:00:08
1711
原创 px移动端适配
一些概念在进行具体的分析之前，首先得知道下面这些关键性基本概念(术语)。物理像素(physical pixel)一个物理像素是显示器(手机屏幕)上最小的物理显示单元，在操作系统的调度下，每一个设备像素都有自己的颜色值和亮度值。设备独立像素(density-independent pixel)设备独立像素(也叫密度无关像素)，可以认为是计算机坐标系统中得一个点，这个点代表一个可以由程序使用的虚拟像素(比如: css像素)，然后由相关系统转换为物理像素。所以说，物理像素和设备独立像素之间存在着一定的
2021-03-09 14:01:11
494
原创 flexible.js实现移动端rem适配方案
源码解析：(function(win, lib) { var doc = win.document; var docEl = doc.documentElement; var metaEl = doc.querySelector('meta[name="viewport"]'); var flexibleEl = doc.querySelector('meta[name="flexible"]'); var dpr = 0; var scale = 0;
2021-03-08 15:01:11
151
原创 微信小程序两个非父子组件之间实时通讯
问题：解决a页面数据变化，b页面实时响应的问题解决办法：在app。js中定义有一个全局变量，对这个变量进行监听 globalData: { APIBaseURL: "", // api基础URL imageBaseURL: "", // 图片基础URL socketURL: "", // socket基础URL authorization: "", // 登录态 account: '', recondNum:-1, }, //app
2021-02-24 14:32:46
633
1
原创 小程序：ble蓝牙连接与安卓通信数据分包
0.定义数据 data: { count:1, //0是wifi连接 1是蓝牙连接 wifiList:[], deviceId:'', services:'', writeId:'', },1.字符串转buffer封装 writeUTF(str) { var back = []; var byteSize = 0; for (var i = 0; i < str.length; i++) { v
2021-01-12 16:29:14
906
原创 小程序：ble蓝牙连接与安卓通信数据组包
1.定义参数data:{ offset: 0, dataArr: [], cmd: undefined, arrLength: undefined, wifiList: [], mac: '' }2.数据组包 //数据组包 packDecoder(value) { let offset = this.data.offset; let data = this.data.dataArr; let cmd = this.da
2021-01-12 16:22:13
360
原创 小程序：ble蓝牙连接
1.定义数据变量 bleList: [], deviceId: '', //设备蓝牙deviceId services: '', //蓝牙的uuid notifyId: '', //开启notify接收 writeId: '', //接收写入的值2.初始化蓝牙 initBlue() { wx.openBluetoothAdapter({//调用微信小程序api 打开蓝牙适配器接口 success: (res)=>
2021-01-12 16:12:51
425
原创 mysql：ERROR 1064 (42000): You have an error in your SQL syntax； check the manual that corresponds to
修改mysql数据库root账号密码时出现以下问题：解决办法：ALTER USER ‘root’@‘localhost’ IDENTIFIED BY ‘123456’;
2020-11-26 14:57:42
539
1
原创 webpack：Invalid options object. PostCSS Loader has been initialized using an options object that doe
在做webpack配置css兼容的时候出现了postcss-loader插件不兼容问题配置代码如下：出现的错误原因是postcss-loader这个版本不支持在webpack。config。js文件中这么写解决办法：在项目根目录下新建一个postcss.config.js文件配置如下：webpack。config.js文件配置如下这样子就解决了版本不兼容的问题...
2020-11-20 14:31:14
4167
8
原创 webpack:The ‘compilation‘ argument must be an instance of Compilation
在webpack配置html文件打包时出现如下错误原因：我的webpack的版本用的5.0的版本，然后与html-webpack-plugin 插件不兼容解决方法：安装4.0及以上的wepback和对应的HtmlWebpackPluginnpm install webpack@4.44.2 -gnpm i html-webpack-plugin -D...
2020-11-19 09:59:49
755
原创 webpack: 无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\webpack.ps1，因为在此系统上禁止运行脚本。
在自己配置webpack打包文件的时候出现了系统禁止运行脚本的问题解决方法：1.打开vscode，运行终端2.执行：get-ExecutionPolicy，显示Restricted，表示状态是禁止的3.执行：set-ExecutionPolicy RemoteSigned4.这时再执行get-ExecutionPolicy，就显示RemoteSigned在最后再去打包就不会有问题了如果再提示你没有安装 webpack-cli的话 你就全局安装一下npm install webpack-cl
2020-11-18 16:21:52
869
原创 修改input标签的placeholder默认样式
修改input标签的placeholder的默认样式代码如下:.inputs::-webkit-input-placeholder {color: #91aeff;}.inputs::-moz-placeholder {/* Mozilla Firefox 19+ */color: #91aeff;}.inputs::-moz-placeholder {/* Mozilla Firefox 4 to 18 */color: #91aeff;}.inputs::-ms-input-p
2020-09-30 14:45:04
281
原创 修改input标签的placeholder的默认样式
新建一个html，里面写一个input标签，修改他的样式placeholder样式如下： input::-webkit-input-placeholder { color: rgba(145, 174, 255, 1); } input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: rgba(145, 174, 255, 1); } inpu
2020-08-28 09:07:01
835
原创 js：前端解析excel文件
1.首先要借助与xlsx这个解析excel文件的插件，引入方式如下：外链：<script src="https://unpkg.com/xlsx/dist/xlsx.full.min.js"></script>vue引入：npm install xlsx -S,需在全局引入这个插件import XLSX from "xlsx";2.通过获取本地excel文件来解析解析代码如下： let teachBtn = document.querySelector('.teac
2020-07-16 16:17:29
3417
原创 css：文本超出隐藏
文本单行超出隐藏 overflow: hidden; text-overflow:ellipsis; //溢出用省略号显示 white-space:nowrap; //溢出不换行（一行内容）文本多行超出隐藏overflow:hidden; //超出的文本隐藏text-overflow:ellipsis; //溢出用省略号显示display:-webkit-box; //将对象作为弹性伸缩盒子模型显示。-webkit-box-orient:vertical; //从上到下垂
2020-06-23 11:58:46
138
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人