前端
Q❀
搞钱搞钱搞钱~~~
展开
-
vue取消控制台输出(隐藏console.log内容)
vue隐藏控制台输出原创 2023-05-15 11:11:18 · 741 阅读 · 1 评论 -
后台管理系统-canvas添加水印
【代码】后台管理系统-canvas添加水印。原创 2022-11-28 15:24:27 · 647 阅读 · 0 评论 -
前端异常监控调研总结
前端和后端处于同一个监控系统中,前端有自己的监控方案,后端也有自己的监控方案,但两者并不分离,因为一个用户在操作应用的过程中如果出现异常,有可能是前端引起,也有可能是后端引起,需要有一个机制,将前后端串联起来,使监控本身统一于监控系统。因此,即使只讨论前端异常监控,其实也不能严格区分前后端界限,而要根据实际系统的设计,在最终的报表中体现出监控对开发和业务的帮助。一般而言,一个监控系统,大致可以分为四个阶段:日志采集。日志存储、统计与分析、报告和警告。原创 2022-10-31 14:32:31 · 1382 阅读 · 0 评论 -
微信小程序之wx.login()与获取手机号getPhoneNumber解密失败问题
小程序报错Given final block not properly padded. 获取手机号的时候解密失败原创 2022-08-31 09:37:42 · 4477 阅读 · 1 评论 -
微信小程序之获取用户信息(流程+2种方法)
获取流程图ui库Vant Weapp:Vant Weapp地址(点击跳转)第一种方法适用于直接点击登录获取在界面添加登录按钮,用户点击按钮调用wx.getUserProfile()函数来提示用户授权登录,授权成功后,把用户头像数据和名称数据保存到缓存区里,并且改变全局变量的值点击登录后![在这里插入图片描述](https://img-blog.csdnimg.cn/04527d080f14473d85a24ec732546458.png登录成功后跳转到首页 <van-but原创 2022-05-09 11:03:24 · 30844 阅读 · 6 评论 -
盘点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 · 2549 阅读 · 0 评论 -
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 · 6950 阅读 · 1 评论 -
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 · 872 阅读 · 0 评论 -
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 · 2823 阅读 · 0 评论 -
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 · 7937 阅读 · 0 评论 -
前端常用到的一些正则验证(数字,邮箱,密码,手机号等)
创建一个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 · 547 阅读 · 0 评论 -
封装组件:一个可以随便拖拽课程的课程表
思路将课程表想象成一个坐标轴,横坐标为星期,纵坐标为节数,利用HTML5新增拖动事件,通过e.target判断拖拽结束的“坐标”,确认最后拖动的位置<div class="schedule-table"> <table> <thead> <tr> <th colspan="2"></th>原创 2021-08-23 16:55:33 · 455 阅读 · 0 评论 -
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 · 2744 阅读 · 0 评论 -
如何解决谷歌跨域问题
右击谷歌快捷方式=》点击属性在目标后面添加 --disable-web-security --user-data-dir=C:\MyChromeDevUserData点击确定关闭谷歌浏览器重新打开浏览器上会显示 : 您使用的是不受支持的命令行标记:–disable-web-security。稳定性和安全性会有所下降。这个时候,你的浏览器就可以进行跨域访问了。如果还是不行在你的电脑盘里新建一个文件夹,位置随意,名称随意,我这里是在C盘里新建一个ChromeTest的...原创 2021-08-02 17:33:43 · 792 阅读 · 0 评论 -
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 · 5945 阅读 · 0 评论 -
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 · 4313 阅读 · 0 评论 -
如何更加高效截取当前地址栏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 · 598 阅读 · 0 评论 -
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 · 212 阅读 · 0 评论 -
(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 · 1040 阅读 · 0 评论 -
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 · 924 阅读 · 0 评论 -
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 · 1118 阅读 · 0 评论 -
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 · 2737 阅读 · 0 评论 -
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 · 1302 阅读 · 0 评论 -
给盒子加contenteditable=“true“之后怎么改样式(继上篇div变textarea)
修改placeholder的样式.txt-word:empty:before { padding: 10px; box-sizing: border-box; content: attr(placeholder); font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; line-height: 22px; color: rgba(178, 178, 178, 1);}.tx原创 2020-11-30 18:05:18 · 1726 阅读 · 0 评论 -
vue+ele:通过(DatePicker)获取日历开始时间和结束时间传入后台调接口并在表格中渲染相对应的数据
思路:使用element-ui中的el-data-picker得到日历样式通过v-model绑定每一个el-data-picker里面的日期通过change方法触发当选择日期发生变化时重新请求接口注意:请求接口传递日历参数值的时候,通过moment协助将日期格式化,并用三元运算符做出处理,当获取不到日期时传递参数为空字符串 <div class="block"> <el-date-picker class="selectDat原创 2020-10-26 14:20:27 · 1826 阅读 · 5 评论 -
Error: Can‘t find Python executable “python“, you can set the PYTHON env variable.
问题描述Error: Can’t find Python executable “python”, you can set the PYTHON env variable.解决办法一.在管理员权限安装windows-build-toolsnpm install --global --production windows-build-tools参考:https://github.com/nodejs/node-gyp如果继续报错Error: Can't find Python exec原创 2020-10-09 10:55:30 · 396 阅读 · 0 评论 -
vue分页器得封装以及使用方法
子组件<template> <div class="pageination_align"> <div class="pageination" v-if="pageinationTotal"> <div @click="pageUp(0)" class="pagination_page" :class="startDisabled?'disabled':''">首页</div> <div @click原创 2020-09-29 17:17:37 · 428 阅读 · 0 评论 -
前端如何下载图片或文件?
一.利用a标签download得属性<a href="http://www.baidu.com" download>download</a>二.window.location.href = “路径”window.location.href="http://www.baidu.com"三.window.open(“路径”)window.open("http://www.baidu.com")拓展:window.location.href和window.open得区别原创 2020-08-14 15:15:33 · 414 阅读 · 0 评论 -
组件的二次封装(弹框为例)
实现思路(核心):封装时可借助ekement-ui(样式)利用好 $listener, $attr隔代传值,在组件中调用属性或方法slot插槽的运用$listener, $attr的详细用法:https://blog.csdn.net/lqlq54321/article/details/106389054*首次封装<template> <div v-if="show"> <div :class="{'base-dialog--mask': true原创 2020-08-12 16:56:38 · 1243 阅读 · 0 评论 -
vuex中mapState...,mapMutations,mapActions的使用
一.state,mutations,actions的作用state:储存一些在actions中接口调用获取的datamutations:修改state中储存的值actions:一般用于调用接口,并且可以通过commit调用mutations,进行储存数据,通过dispatch调用actions里面的接口,实现页面刷新,使页面保持最新的数据import { enterpriseCertification, certificationExamine, certificationR原创 2020-08-03 17:01:55 · 372 阅读 · 0 评论 -
element-ui中怎么使用分页器??
1.将element-ui里面的组件引入过来以及事件2.绑定自己想要的数据(一般数据是与table结合)3.将table表格中的数据和分页器的数据相对应<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="currentPage" :page-sizes="[5, 10, 20, 40]" :原创 2020-07-29 13:51:24 · 1629 阅读 · 1 评论 -
vue中对后台返回数据时间戳的处理
方法一: this.list.forEach(v => { var year = parseInt(v.created_at / (360 * 30 * 24 * 60 * 60 * 1000)); var month = parseInt(v.created_at / (30 * 24 * 60 * 60 * 1000)); var days = parseInt(v.created_at / (24 * 60 * 60 * 1000));原创 2020-07-29 13:39:10 · 1306 阅读 · 0 评论 -
原生js实现购物车的功能?
<div class="box"> 商品名称:<input id="goods" type="text" placeholder=" 请输入商品名称"> <br><br> 商品价格:<input id="price" type="number" placeholder=" 请输入商品价格"> <br><br> 商品数量:<input i原创 2020-06-26 20:03:14 · 281 阅读 · 0 评论 -
微信小程序tabBar怎么切换,实现页面的跳转?
效果图如何实现?"tabBar": { "selectedColor": "#d81e06", "list": [{ "pagePath": "pages/index/index", "text": "首页", "iconPath": "/images/home.png", "selectedIconPath": "/images/home-active.png" },{ "pagePath": "pages/clas原创 2020-06-25 20:42:03 · 2049 阅读 · 0 评论 -
微信小程序怎么使用template模块?比如template写一个登录弹框
干什么的?啥时候会用到?微信的模版主要是用于公共界面管理,比如弹窗或公共页面都可以用模版定义。一.微信小程序怎么使用template模块?1.创建模板文件2.index.wxml=><template name="apifmLogin"> <view class="apifmLogin" hidden="{{wxlogin}}"> <view class="s-b"> <view class="s-l-b">原创 2020-06-24 21:25:55 · 674 阅读 · 0 评论 -
微信小程序怎么进行传值?
一.父传子描述:在父组件中通过自定义属性来传值,在子组件js文件中通过properties属性来进行接受,可以设置默认值,最后在子组件中直接渲染就可以。1、父组件的json文件中声明对引用子组件// parents.json{ "usingComponents": { "w-child": "/components/child/child" }}2、父组件的wxml中使用子组件<w-child fatherName='winne' fatherAge='22'>原创 2020-06-23 19:09:42 · 476 阅读 · 0 评论 -
微信小程序接口的二次封装
主要思路:实现接口的拼接:分为 ‘ 固定接口 ’拼接和‘ 随意接口 ’拼接如何实现接口的拼接:分为三次拼接:1.创建一个env.js,里面写自己前面默认的接口地址,可以定义一些配置其他环境的接口eg:baseUrl:“https://api.it120.cc”2.创建一个request.js,可以在里面设置一些自己默认配置的一截eg:const subName = ‘lqi’let _url = ${baseUrl}/${isDoMain?subName:''}${url}3.创建一个a原创 2020-06-22 22:51:06 · 521 阅读 · 0 评论 -
js实现100个不同 大小,颜色,位置 小球的出现
思路:1.创建一个放置小球的盒子2.定义一个定时器,记录随机小球出现的时间3.创建一个小球,并且得给它设置样式4.利用Math.random个创建得小球定义随机的大小,颜色和位置5.将创建的这个小球追加到刚开始创建的盒子里面样式 * { margin: 0; padding: 0; } body { background-color: black; }原创 2020-06-22 21:46:04 · 804 阅读 · 0 评论 -
element-ui中怎么使用表单(input)?绑定、校验
绑定:在el-form标签上绑定数据::model=“userForm”校验::rules=“userRules”在子标签el-form-item中添加props属性props=“userRules里面设置的数组名” <el-form :model="userForm" ref="adduser" :rules="userRules" label-position="left" label-wi原创 2020-06-21 17:50:36 · 2080 阅读 · 0 评论 -
运用webpack怎么使用echarts?与调用接口结合使用??
第一步:安装echartsnpm install echarts --save第二步:引入1.完整引入echarts2.按需引入(用哪个,引哪个,减少文件体积)可以按需引入的模块列表见https://github.com/apache/incubator-echarts/blob/master/index.js第三步:初始化echarts// 基于准备好的dom,初始化echarts实例var myChart = echarts.init(main);第四步:配置图表选项分为默认配置和原创 2020-06-20 23:10:31 · 276 阅读 · 0 评论