- 博客(90)
- 收藏
- 关注
RSS订阅原创 elementui的el-table自定义控制展开事件，实现“展开”“收起”的切换（两种效果）【超级完整式代码】
全网代码最全：elementui的el-table自定义控制展开事件，实现“展开”“收起”的切换（两种效果）
2024-01-25 14:50:02
1480
原创 前端异常监控调研总结
前端和后端处于同一个监控系统中，前端有自己的监控方案，后端也有自己的监控方案，但两者并不分离，因为一个用户在操作应用的过程中如果出现异常，有可能是前端引起，也有可能是后端引起，需要有一个机制，将前后端串联起来，使监控本身统一于监控系统。因此，即使只讨论前端异常监控，其实也不能严格区分前后端界限，而要根据实际系统的设计，在最终的报表中体现出监控对开发和业务的帮助。一般而言，一个监控系统，大致可以分为四个阶段：日志采集。日志存储、统计与分析、报告和警告。
2022-10-31 14:32:31
1295
原创 微信小程序之wx.login()与获取手机号getPhoneNumber解密失败问题
小程序报错Given final block not properly padded. 获取手机号的时候解密失败
2022-08-31 09:37:42
4253
1
原创 微信小程序之获取用户信息（流程+2种方法）
获取流程图ui库Vant Weapp：Vant Weapp地址（点击跳转）第一种方法适用于直接点击登录获取在界面添加登录按钮，用户点击按钮调用wx.getUserProfile()函数来提示用户授权登录，授权成功后，把用户头像数据和名称数据保存到缓存区里，并且改变全局变量的值点击登录后![在这里插入图片描述](https://img-blog.csdnimg.cn/04527d080f14473d85a24ec732546458.png登录成功后跳转到首页 <van-but
2022-05-09 11:03:24
30085
5
原创 盘点vue-element-admin下载到登录碰到的一些坑
vue-element-admin快速上手启动项目登录流程解析替换接口实现登录替换接口遇到的问题快速上手官方文档：https://panjiachen.github.io/vue-element-admin-site/zh/guide/启动项目拉取代码之后进行npm i 安装ctrl -c 之后执行命令：git config --global url.“https://”.insteadOf git://重新 npm i 成功！npm run dev 启动成功
2022-04-25 16:04:56
2387
原创 vue 将base64 的文件流转换成pdf 预览并下载
<el-tooltip placement="right-start" effect="light"> <div slot="content" class="content" @click="downFile(photosList[index])" > 下载 ...
2022-03-11 16:20:06
6672
1
转载 nvm安装node时npm安装失败问题
执行nvm install vnode 失败报错截图：如何解决1.下载nvm https://github.com/coreybutler/nvm-windows/releases/download/1.1.6/nvm-setup.zip ，解压并且安装2.打开cmd ，输入nvm -v，如下表示成功3.在nvm安装目录，找到 setting.txt加上如下两行（ 设置 node 和 npm 镜像地址，一般在 C:\Users\用户名\AppData\Roaming\nvm）：node_mi
2022-02-21 16:40:41
3194
原创 vue下载后端返回的二进制流excel表格文件
返回的二进制流格式 <span class="update" @click="lookRecord">点击下载</span> lookRecord() { integrateRecordsr(this.realAccount).then((res) => { // 调接口拿取二进制流 if (res.size == 0) { // 如果返回是空的 this.$message({ me
2022-02-10 10:03:06
839
原创 vue配置各种环境-环境切换问题-打包自由切换
vue-cli版本是2.0左右的就会有webpack的config目录vue-cli版本是3.0以上的就会有vue.config.js没有config目录我们先来看第一种怎么配置（有webpack的config目录）目录：配置：这里一共展示dev环境和生产环境，其他环境在config目录类似添加第一步： config目录=》index.js dev: { assetsSubDirectory: 'static', assetsPublicPath: '/', p.
2022-01-12 11:01:51
2716
原创 函数提升与变量提升常见面试题
函数提升与变量提升在JavaScript中，变量的定义和函数的定义都会被提升，而且函数的声明优先于变量的声明；在变量中，变量的赋值不会被提升，只是声明被提升了，但是函数的声明有点不一样，如果是函数式声明则函数体也会被一同提升，如果是var式的声明，怎么提升声明，不会提升函数体。例子1：var a=3; function b(){ if(a){ var a=1; }else{ var a=0; } consol
2021-12-29 11:02:06
858
原创 普通函数与箭头函数this输出顺序以及原理
普通函数与箭头函数this输出this是指包含它的函数作为方法被调用 时所属的对象。（谁调用了我，我就是谁的对象，谁最后调用了我，我就是谁的对象。）注意：一定是this所在的函数作为方法被调用，才有可能改变this指向，也就是说这个this外面有个函数，被调用了！箭头函数没有自己的this， 它会捕获其所在（即定义的位置）上下文的this值， 作为自己的this值匿名函数的this指向所在的方法被调用的那个对象作用域对象—看例1let length = 10; function
2021-12-29 11:00:46
234
原创 高级JavaScript - 关于前端面向对象执行顺序面试题
1.下面代码运行的结果//1. 答案： 0 30function fun(){ this.a=0; this.b=function(){ alert(this.a); }}fun.prototype={ b:function(){ this.a=20; alert(this.a); }, c:function(){ this.a=30; alert(this.a)
2021-12-29 10:59:36
301
原创 宏任务与微任务的执行顺序
1.同步任务和异步任务JavaScript是单线程执行的语言，在同一个时间只能做一件事情。这就导致后面的任务需要等到前面的任务完成才能执行，如果前面的任务很耗时就会造成后面的任务一直等待。为了解决这个问题JS中出现了同步任务和异步任务。（1）同步任务在主线程上排队执行的任务只有前一个任务执行完毕，才能执行后一个任务，形成一个执行栈。（2）异步任务不进入主线程，而是进入任务队列，当主线程中的任务执行完毕，就从任务队列中取出任务放进主线程中来进行执行。由于主线程不断重复的获得任务、执行任务、再获取再执
2021-12-29 10:57:38
9217
原创 多种for循环执行顺序问题（案例+解析）
for循环相关for(var i = 1; i <= 5; i ++){ console.log(i) // 1 2 3 4 5}观察以下代码:for(var i = 1; i <= 5; i ++){ setTimeout(function timer(){ console.log(i) //5个 6 }, 0)}问题描述：为什么会全部输出6？如何改进，让它输出1，2，3，4，5？原因：因为setTimeout为宏任务，由
2021-12-29 10:55:44
937
原创 Vue+ElementUI: 手把手教你做一个audio组件，audio的播放与下载
audio组件：播放功能先看效果图：功能：可进行播放，暂停，刷新，调节播放速度，滚动条拖拽代码<template> <div class="musicPlay" v-if="audioVisible"> <audio ref="audio" @play="playFunc" @pause="pauseFunc" @timeupdate="timeupdateFunc" @canplay="can
2021-12-22 11:01:22
7540
转载 如何将本地项目上传到Github
一、使用git上传文件到GitHub需要git客户端以及注册GitHub账号。git官网:https://git-scm.com/github官网:https://github.com/git的安装以及GitHub的注册这里就不说了。下边就直接从上传开始。第一步：我们需要先创建一个本地的版本库（其实也就是一个文件夹）。 你可以直接在桌面右击新建文件夹，也可以右击打开Git bash命令行窗口通过命令来创建。 现在我通过命令行在桌面新建一个test文件夹（你也可以在其他任何地方创建这个
2021-11-04 15:43:05
301
转载 elementUi重置表单清除校验resetFields()不起作用
当我们清除校验时一般在关闭弹框的时候会使用this.$refs[formData].resetFields(); <el-dialog title="新增xx公司" :visible.sync="addCompanyVisible" width="30%" :modal-append-to-body='false' class="urgecompany-dialog" @close="closeDialog" > <el-form class="
2021-10-21 09:18:49
1167
原创 前端常用到的一些正则验证（数字，邮箱，密码，手机号等）
创建一个js文件//复杂密码验证/** * 字母+数字+特殊符号 * @param {*} password */ export function validatePassword (password) { const reg = /^(?=.*[a-zA-Z])(?=.*\d)(?=.*[~!@#$%^&*()_+`\-={}:";'<>,.\/]).{8,16}/ return reg.test(password)}//只能输入数字/** * 数字 *
2021-09-17 16:55:01
498
原创 封装组件：一个可以随便拖拽课程的课程表
思路将课程表想象成一个坐标轴，横坐标为星期，纵坐标为节数，利用HTML5新增拖动事件，通过e.target判断拖拽结束的“坐标”，确认最后拖动的位置<div class="schedule-table"> <table> <thead> <tr> <th colspan="2"></th>
2021-08-23 16:55:33
391
原创 Avue给table的某一列设置样式，点击实现页面跳转或是其他操作
最近写的一个小功能将姓名一例字体换成蓝色，，并且点击实现跳转给某一类添加样式1.在avue-crud组件中添加cell-class-name属性<avue-crud :data="data" :option="option" :page.sync="page" :cell-class-name="addClass" @cell-click="pageto" ></avue-crud> /**
2021-08-13 10:13:27
2591
原创 如何解决谷歌跨域问题
右击谷歌快捷方式=》点击属性在目标后面添加 --disable-web-security --user-data-dir=C:\MyChromeDevUserData点击确定关闭谷歌浏览器重新打开浏览器上会显示 ： 您使用的是不受支持的命令行标记：–disable-web-security。稳定性和安全性会有所下降。这个时候，你的浏览器就可以进行跨域访问了。如果还是不行在你的电脑盘里新建一个文件夹，位置随意，名称随意，我这里是在C盘里新建一个ChromeTest的...
2021-08-02 17:33:43
549
转载 elementUI的el-select 默认值显示value不显示label问题
el-select 默认值显示value不显示label问题在做编辑页面时需要取到列表项数据回显默认值在做select回显的时候遇到了这个问题明明拿到的值和value中的值一样但是就是不转换成label这种情况一般出现在value为数字的情况问题原因是返回的数字和el-option选框里value值的类型对应不上一个是 Numer 一个是 String解决后如图解决办法1既然el-option选框需要的value属性是String类型的,可以利用row这个一行数据,拿到el-o
2021-06-18 10:15:00
5759
原创 vue项目启动经常中断，针对node溢出问题的解决
可能出现的报错：1.error Command failed with exit code 134报错2.项目太大以至于项目启动慢，启动之后修改项目立马中止需要重新启动如何解决1.安装两个npm包：npm install increase-memory-limit cross-env -g2.在项目中的package.json里面的scripts里面添加脚本 "fix-memory-limit": "cross-env LIMIT=4096 increase-memory-limit"
2021-06-16 09:24:46
3996
原创 iframe父子页面传值(小案例)
iframe.html <button id="send">确认事件</button> <div id="content"></div> window.onload = function() { var btn = document.getElementById("send"); var transObj = { target: "求救事件", content: "有人晕倒了" };
2021-04-27 15:11:00
150
原创 如何更加高效截取当前地址栏url参数
适用场景：但我们进入页面的时候，想要拿到当前地址栏url的某个参数我们可以封装一个js文件作为一个截取地址栏的工具eg:https://smb.cochat.lenovo.com?code=fc7285c5-85eb-447f-a69c-637e2fbd50a5&®isterChannel=111如何截取到code或者registerChannel呢？当前是在vue中（当然js也是没问题的）function getQrCode(params) { var query =
2021-04-09 10:12:56
568
原创 vue项目如何实现复制粘贴剪切板功能–vue-clipboard2
安装npm i vue-clipboard2 -S引入import VueClipboard from 'vue-clipboard2'Vue.use(VueClipboard)复制一个变量的值<el-button class="copy_" @click="copyed_herf">复制</el-button>jscopyed_herf(){ this.$copyText(this.hrefUrl).then(e=>{ this.$m
2021-03-30 15:16:21
199
原创 (git checkout 某分支)切换分支报错:Please, commit your changes or stash them before you can switch branches.
问题重现：场景：现在是主分支代码，当我要切换到我的分支提交代码时我的目的:将主分支合并我的分支代码并且提交解决办法：1.//存到暂存区git add .git stash 2.git checkout 自己的分支名3.git stash pop //取出刚刚存到暂存区的代码4.git add . git commit -m '提交代码说明'5.git checkout master //切换到主分支6.git merge 自己的分支名7.git pull 8.git
2021-03-08 14:03:08
972
原创 git commit提交时报错husky ＞ pre-commit (node v10.16.3) ....
报错原因:使用了husky，pre-commit(客户端)钩子，它会在Git键入提交信息前运行做代码风格检查。如果代码不符合相应规则，则报错报错信息：解决办法：使用commit的时候后面加上 --no-verify（规范）git commit -m "备注信息" --no-verify...
2021-03-03 10:14:50
885
原创 Handlebars模板引擎中的each用法（type=“text/x-handlebars-template“）
**handlebar**概述与介绍Handlebars 是 JavaScript一个语义模板库，通过对view和data的分离来快速构建Web模板。它采用"Logic-less template"（无逻辑模版）的思路，在加载时被预编译，而不是到了客户端执行到代码时再去编译， 这样可以保证模板加载和运行的速度。简单的说就是：Handlebars是一个很好的前后端的分离的方案使用Handlebars的安装是比较简单和方便的;handlebars是一个纯JS库，因此你可以像使用其他JS脚本一
2021-02-24 16:58:26
1047
原创 Array map()将数组中每一个对象循环添加一个字段
当我们请求接口之后为了方便想在返回数据中的数组中每一个对象循环都添加一个字段？??arr原数组为[ {fruit: 'apple',price: '25'}, {fruit: 'banana',price: '10'}, {fruit: 'pineapple',price: '15'}]let arr_ = []arr.map((item, index) => { _arr.push(Object.assign({},item,{flag: false}))}))//
2021-02-24 16:07:30
2674
原创 vue封装一个柱状图组件（eCharts）以及如何使用
五分钟上手eCharts上代码：<div class="information_Line"> <div class="header"> <span>{{title}}</span> </div> <p>{{ title_ }}</p> <div class="huEcharts" ref="huEcharts"> <div :id="id" :.
2021-01-19 10:36:28
1262
原创 如何使用element-ui中的el-upload上传图片,图片检验大小/格式/缩放？
最近在写一个图片上传的功能，不仅要上传，还要进行缩放，并且对图片格式大小进行验证： <el-upload action="https://smb-test.cochat.lenovo.com/attachment-server/upload" :show-file-list="false" accept=".jpg, .jpeg, .png" list-type="pi
2020-12-07 16:05:31
1406
原创 element-ui里的el-table是怎么实现超出内容省略并加tooltip提示的？
效果图效果描述：只有超出10个字的标题才会显示el-tooltip,没有超出的不会显示思路：表格中的数据超出10个字显示隐藏，用hover效果显示el-tooltip并显示全部的文字代码： <el-table-column label="标题" width="180"> <template slot-scope="scope"> <el-tooltip class="item"
2020-12-07 15:10:32
3184
原创 el-table样式问题：如何修改element-ui表格中按钮悬浮显示但是被el-table溢出隐藏的问题?
最近在写elment-ui样式表格中遇到了溢出隐藏的问题，确实在控制台找了好久，比较麻烦在没有设置之前设置之后上代码/deep/.el-table tbody tr:hover>td { background-color: #242133 !important; position: relative;}/deep/.el-table__body-wrapper { overflow: visible !important;}/deep/.el-table
2020-12-07 14:15:32
1951
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人