qq_45894929的博客

原创 el-table中表头加了文字提示用的el-popover，加了固定列，文字提示失效

问题： el-popover悬浮文字，在固定列后，悬浮不显示解决： 使用el-tooltips组件（改变样式：popper-class=‘tooltips’,写在style全局样式中）

原创 el-dialog有滚动条，第一次打开滚动到底部，关闭，再次打开还在底部

问题： el-dialog有滚动条，第一次打开滚动到底部，关闭，再次打开还在底部解决： 使用append-to-body=“true”Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true问题： 使用append-to-body="true之后，dialog中自己加类名写的样式不生效解决： 将样式改为全局样式...

原创 TypeScript学习

一.安装npm install -g typescriptcd typescript-demotsc --init // 生成tsconfig.json1、vscode配置自动编译 1.第一步 tsc --inti 生成tsconfig.json 改 "outDir": "./js", 2.第二步 任务 - 运行任务 监视tsconfig.json二.数据类型格式一：let 变量名: 变量类型 = 初始化值格式二：let 变量名: 变量类型 | unde

原创 git在commit之前切换分支

应用场景： 这个月的需求应该是要在新的分支上进行开发的，开发的时候忘了直接在上个月的分支开发了，也改了很多，想把改的内容提交到新的分支上，就需要在不commit之前切换下分支，找到了一种解决办法，记录一下～git stash步骤：1.使用git stash命令git stash2.切换分支git checkout 1.7.0.03.使用git stash apply，之后可以使用git status 查看一下修改的内容在在不在当前分支上git stash apply

原创 Echarts图表使用过程中遇到的问题

Echarts1.el-tab 切换echarts[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ZJhJp1aj-1637632849322)(img/tabs切换echarts.png)]监听el-tab的@tab-change= "handleChange"事件在handleChange中对echarts实例自适应大小 // myChart = echarts.init(document.getElementById("pie-echart"));

原创 获取字符串中多个大括号里面的内容

1.需求1：获取字符串中 多个${ MJSJ}步骤：首先获取{}大括号里面的，包括大括号获取到的是包含大括号里数据的数组 [’{NSRMC}’,’{SWSXMC}’]再用replace替换掉大括号2.需求2:获取除参数以外的字符串的长度步骤：在字符串中将数组中的内容替换掉尊敬的纳税人$:，您的$业务已受理通过。请您尽快登录电子税务局，待办事项中完成后续缴款操作再去掉$就可以了 //str:尊敬的纳税人:${NSRMC}，您的${SWSXMC}业务已受理通过。请您尽快登录

原创 循环生成的el-form-item项清除校验

1.给循环生成的el-form-item 添加ref属性2.获取循环生成的dom元素，是要使用$nextTick

原创 mavonEditor编辑器的使用

本次使用不涉及图片上传，只是简单文本的编辑。1.官网github:https://github.com/hinesboy/mavonEditor2.安装npm install mavon-editor --save3.导入 main.js//编辑器import mavonEditor from "mavon-editor";import "mavon-editor/dist/css/index.css";Vue.use(mavonEditor);4.使用1.封装成组件&l

原创 element-ui中el-form验证清除报clearVaildate为undefined

表单中的dom元素还没加载完成 this.visible = true this.$nextTick(() => { this.$refs.refAddForm.clearValidate() })

原创 上传sb3文件,通过获取首帧来判断是否为sb3文件并获取首帧作为封面图

做的一个是有关少儿编程的项目,甲方的需求是通过获取首帧来判断是否是sb3文件,而不是通过后缀名来判断的,以防别人改后缀名来上传文件在main.js引入,在展示sb3文件的时候也会用到//安装"scratch-vm": "0.2.0-prerelease.20191119203901", "scratch-render": "0.1.0-prerelease.20191126210304", "scratch-storage": "1.3.2", "scratch-svg-render

原创 两个数组过滤掉其中包含相同的id

let arr1Ids = this.courserelateclass.map((item) => item.id); const result = this.associationForm.class_id.filter( (item) => !arr1Ids.includes(item) );应用:在确定的时候提交选中的,过滤掉之前选中

原创 watch监听路由携带参数变化

1.例如一些帖子详情页面中有其他的帖子,当点击其他帖子,页面还是当前页面,只需要改变路由传递的参数id watch: { $route: "getPath", }, methods: { getPath() { this.id = this.$route.query.id; this.getDetail(); this.getArticlesList(); this.getDis(); this.makeCode();

原创 el-popver通过v-model不能控制显示隐藏

原创 el-picker-date禁选今天之前的日期

:picker-options="expireTimeOption" expireTimeOption: { disabledDate(date) { //disabledDate 文档上：设置禁用状态，参数为当前日期，要求返回 Boolean return date.getTime() < Date.now() - 24 * 60 * 60 * 1000; }, }, <el-date-pic.

原创 使用el-date-picker时间选择出现“TypeError:dateObject.getTime is not a function“报错

<el-form-item label="完结时间" prop="end_at" class="coursename"> <el-date-picker v-model="ruleForm.end_at" type="date" placeholder="请选择完结日期" class="date" format="yyyy 年 MM 月 dd 日"

原创 本地记住用户密码,进行加密操作

1.在登录成功时,进行保存并加密 let username = window.btoa( window.encodeURIComponent(this.loginUserForm.username) ); localStorage.setItem("username", username); // 密码 let pa

转载 el-input设置类型为number时，中文输入法光标上移问题

添加链接描述

原创 vue中的子父组件传值

1.父传子在父组件中 传值 <reply :reply='current'></reply>在子组件中接收 props: { reply: { type: Number, default: 0, }, },2.子传父在子组件中触发 this.$emit("setting", 9);在父组件中调用 <router-view @setting="Setting"></router-view&

原创 vue的bus总线

1.安装busnpm install vue-bus2.main.js引入busimport VueBus from 'vue-bus';Vue.use(VueBus);3.触发事件 this.$bus.emit("setting", 9);4.监听事件 created() { this.$bus.on("setting", (data) => { this.current = data; }); },5.销毁事件 destroyed()

原创 事件冒泡和捕获

冒泡1.父元素和子元素都有点击事件2.点击子元素,父元素的点击事件也会触发3.冒泡是从内向外冒捕获1.父元素和子元素都有点击事件2.点击父元素,子元素的点击事件也会触发4.捕获是从外向内的...

原创 使用element-ui写密码验证

![在这里插入图片描述](https://img-blog.csdnimg.cn/20210709111222115.png![在这里插入图片描述](https://img-blog.csdnimg.cn/20210709111243936.png <el-form ref="pNextFormRef" :model="pNextForm" :rules="pNextFormRules" class="form"

原创 使用element-ui写获取验证码输入框

<el-form-item prop="verify"> <div class="bind_code margin_top"> <el-input class="bind_code_input code" v-model="registerForm.verify" type="text" ...

原创 el-dialog去掉自带样式

<!-- 重置密码弹框 --> <el-dialog :visible.sync="dialogVisible" class="dialog" :show-close="false"> <div class="title"> <span>重置密码</span> <img src="../../assets/images/close.png" alt="" @click="close...

原创 textarea右下角有字数计算

<el-form-item label="作品简介" prop="content" class="content"> <el-input type="textarea" v-model="ruleForm.content" @input="descInput($event)" maxlength="200" ></el-input> &l...

原创 去掉input框type为number的右边的上下箭头

1.el-input中的input/deep/input[type="number"] { -moz-appearance: textfield;}/deep/input[type="number"]::-webkit-inner-spin-button,/deep/input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none !important; margin: 0;}2.inputinp

原创 去掉滚动条

在有滚动条的元素上加 &::-webkit-scrollbar { display: none; }

原创 flex布局给文字加省略号

word-break: break-all; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;错误做法:

转载 HTTP状态码

1.概念HTTP状态码表示客户端HTTP请求的返回结果、标记服务器端的处理是否正常或者是出现的错误,能够根据返回的状态码判断请求是否得到正确的处理，这很重要2.组成状态码由3位数字和原因短语组成,例如下图所示:数字中的第一位指向了响应类别，后两位无分类，响应类别有以下5种：状态码分类表类别原因短语1**informational（信息性状态码）接受的请求正在处理2**Success（成功状态码）请求正常处理完毕3**Redirection（重定向）

转载 浅拷贝和深拷贝

1.数据类型数据类型分为基本数据类型（String、Number、Boolean、Null、Undefined、Symbol (es6引入的一种类型) ）和引用数据类型（Object、Array、Function）。基本数据类型的特点:直接存储在栈中引用数据类型 :它的真实数据存储在堆内存中,栈中存储的只是指针,指向堆中的实体地址2.浅拷贝和深拷贝(深拷贝针对引用数据类型)深拷贝只是针对Array和Object这样的引用数据类型.简单来说,浅拷贝只是拷贝了它在栈中存储的指针,它们指向的都是同一个堆

原创 multipleSelect下拉插件的使用

Multiple Select 是一个通过复选框来选择多元素的 jQuery 插件:).官网地址:添加链接描述

原创 js中的indexOf,map,filter,forEach,some,every方法

1.indexOf()indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。1.1语法://searchvalue:必需。规定需检索的字符串值。//fromindex:可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。stringObject.indexOf(searchvalue,fromindex)1.2说明:该方法将从头到尾地检索字符串 stringObje

原创 vue中点击导航跳转首页对应的位置

mounted() { let _this = this; this.$nextTick(() => { setTimeout(() => { let targetbox = document.getElementById("base"); //获取id为base距离顶部的高度 _this.base = targetbox.offsetTop; let targetbox1 = document.get

转载 vue中跳转页面跳到页面顶部

scrollBehavior(to,from,savedPosition){if(savedPosition){return savedPosition;}else{return {x:0,y:0}}},或者scrollBehavior (to, from, savedPosition) {return { x: 0, y: 0 }}

原创 修改element-ui中分页样式

<div class="explore_right_pages" v-if="allCount > 10"> <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page.sync="currentPage3" :page-size="10" ..

原创 el-form修改表单校验提示信息的位置

/deep/.timr.el-form .el-form-item__error { top: 21%; right: 25% !important; left: unset;}

原创 element-ui中el-radio修改样式

/deep/.el-radio__input.is-checked .el-radio__inner { border-color: #ff9213; background-color: #ff9213;}/deep/.el-radio__inner:hover { border-color: #ff9213;}

原创 element-ui中修改el-checkbox中的样式

/deep/.is-checked .el-checkbox__inner { background-color: #ff9213 !important; border: 1px solid #ff9213 !important;}/deep/.el-checkbox__inner:hover { border-color: #ff9213;}/deep/.el-checkbox__input.is-checked + .el-checkbox__label { color: #ff

原创 uni中将px转换为rpx

this.canvasW = uni.upx2px(550);

原创 uniapp中通过地理位置转换经纬度打开腾讯地图

1.1通过地里位置获取经纬度1.1.1要先申请密钥并下载文件1.1.2导入文件var QQMapWX = require('@/utils/qqmap-wx-jssdk.min.js'); var qqmapsdk;1.1.3在onload中初始化qqmapsdk = new QQMapWX({ key: 'OEEBZ-GGAKJ-W2AF4-KIIFX-WGJG6-PNFMJ' //这里自己的secret秘钥进行填充});1.1.4转换经纬度//通过地理位置获取经纬度

原创 uni预览pdf文件

uni.downloadFile({ url: 'https://example.com/somefile.pdf', success: function (res) { var filePath = res.tempFilePath; uni.openDocument({ filePath: filePath, success: function (res) { console.log('打开文档成功'); } });