随笔分类 - Vue
函数防抖
摘要：当业务功能满足以下三个条件： 1、频繁触发 2、耗时操作 3、只关心最终结果 function debounce(fn,deplay=300){ let timerId; return function(...args){ if(timerId){ clearTimeout(timerId); }
阅读全文
根据数组整合出选年月
摘要：data: [ //这是后端的数据 ['2012年', '2012', '1季度', '1'], ['2012年', '2012', '2季度', '2'], ['2012年', '2012', '3季度', '3'], ['2012年', '2012', '4季度', '4'], ['2013年'
阅读全文
全屏显示功能（vue）
摘要：<!-- 全屏显示 --> <div class="btn-fullscreen" @click="handleFullScreen"> <i class="el-icon-rank"></i> </div> // 全屏事件 handleFullScreen () { let element = d
阅读全文
密码框常用的正则（vue）
摘要：至少八个字符，至少一个字母和一个数字： "^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,}$" 至少八个字符，至少一个字母，一个数字和一个特殊字符： "^(?=.*[A-Za-z])(?=.*\d)(?=.*[$@$!%*#?&])[A-Za-z\d$@$!%*#?&]{8
阅读全文
vue使用SM4加密
摘要：安装 npm install gm-crypt 使用 1 //点击登录按钮方法 2 private submitFn(formName: any) { 3 //导入gm-crypt插件，对密码进行加密 4 const SM4 = require("gm-crypt").sm4; 5 let sm4C
阅读全文
防抖（vue防抖使用）
摘要：防抖：多次触发事件后，事件处理函数只执行一次，并且是在触发操作结束时执行 使用场景：频繁触发事件，搜索框输入值，及滚动条触发事件 实现代码： 1.为了我们方便使用防抖我们需要重复书写同样代码，可以封装一个方法utils.js 2.防抖一共有两个版本一种是立即执行一种是非立即执行 第一种：非立即执行：
阅读全文
vue使用ts验证码获取倒计时60秒（自己手写的）
摘要：html： <el-form :model="emailForm" :rules="rules" class="elform"> <el-form-item label="输入邮箱：" label-width="120px" prop="email"> <el-input class="wjinpu
阅读全文
在开发项目中使用element-ui表格文本过长使用省略号踩得坑
摘要：在表格列加show-overflow-tooltip之后会发现并没有出现省略号而是隐藏文本，这原因是因为webpack的dllPlugin来做性能优化，dll在打包后，ElementUI的tooTip丢失。导致显示不了。至于table表中超出部分只遮掉，不显示省略号，是因为在template中使用了
阅读全文
调用本地时间一秒执行一次ts写法
摘要：private initTimer() { const self = this; setInterval(() => { const date = new Date(); const Str = date.getFullYear() + "-" + self.lpad(date.getMonth()
阅读全文
ts中的element-ui的注意事项自定义校验如何在ts中写validator
摘要：上次的博客写的有些问题，经过我的研究要写校验新密码和确认密码，pattern就已经不适用了，它毕竟是写校验正则比较好，但是自定义校验两个密码是否一致的时候就有点累赘了所以我研究了一下写出来了以下供大家参考，我也看到百度方面对ts的文章较少所以给大家总结一下我的经验，经验不足，还请大家见谅 代码如下：
阅读全文
二维数组对象拆分一维数组
摘要：btsArray:[ 0:[ {...}, {...} ], 1:[ {...}, {...} ]] let formlists = []; for (let i = 0; i < this.btsArray.length; i++) { for (let j = 0; j < this.btsAr
阅读全文
一维数组中的对象转换成二维数组
摘要：举例子：这是一个一维数组对象 formList:[{ affiliation: 0 affiliationInfo: "签署方1" defaultValue:xxx },{ affiliation: 0 affiliationInfo: "签署方1" defaultValue:xxx },{ aff
阅读全文
快速理解vuex，浅谈vuex
摘要：最近没事干研究了下vuex，发现在官方文档不管怎么看也看不懂它到底干了什么，于是我将他们拆解下来做了一个图表方便清楚的认知他们到底做了什么方便以后怎么用 这样拆解下来发现是不是对vuex的流程大致有一个理解了 接下来我用自己的文字对他做一个注解 1、首先如果看不懂这个流程图，我们可以选择倒推 2、s
阅读全文
vue中父传子，子传父 怎么相互传值（个人理解）
摘要：父传子： 子组件使用props接收父组件的值 父组件(test.vue)： 1 <template> 2 <!-- 父传子 --> 3 <div class="container"> 4 父组件:<input type="text" v-model="value"> 5 <!-- 引入子组件 -->
阅读全文
富文本
摘要：推荐一个富文本： https://github.com/vuejs/awesome-vue 这里面记录了vue技术栈相关的 框架 组件库 插件 文章 博客 教学视频 https://github.com/surmon-china/vue-quill-editor 富文本 安装： 1、npm inst
阅读全文
封装vue插件
摘要：例如：我要在components下封装一个面包屑插件公用与各个页面，我需要在每个页面下impont导入，导致多个页面重复需要import导入，所以决定要对这个组件进行封装 第一步：在components下创建index.js文件 //定义一个插件 //规则：模块向外暴露一个对象，对象中选项insta
阅读全文
Avoided redundant navigation to current 冗余导航报错
摘要：发现原因：做vue项目中，不断重复点击当前路由导航会发生报错， 解决方案： const originalPush = VueRouter.prototype.push; VueRouter.prototype.push = function push(location) { return origi
阅读全文
async与await使用
摘要：自己总结的： 1、让异步的代码可以使用同步的方式，逻辑更加清晰，优雅 2、重点：基于promise使用 模拟场景：调用A接口的同时返回数据后在次调用B接口获取数据 export default { async created () { // 使用 promise 方式 // 调用A // this.
阅读全文
vue封装sessionStoage存储信息
摘要：创建store文件夹下index.js文件 var KEY='rabbitStudent' export default{ setUser(user){ //将后端返回的对象转换成字符串 const JsonStr=JSON.stringify(user) // 将返回的字符串存储到KEY中 win
阅读全文
传统项目与前后端分离项目的区别（token理解）
摘要：传统项目： 以往的传统项目使用session（服务器的会话存储），前提必须是前端代码和后端代码必须在同一服务器下进行，当客户端像服务器发送登录请求的时候，服务器会存储用户信息键（key）和值的同时会设置客户端的cookie，然后将key值返回给客户端， 前后端分离： 1.cookie在同一个域名下才
阅读全文
浙公网安备 33010602011771号