momo_mom177-优快云博客

使用到ES6的解构赋值，这个名字很形象，从对象中分解出来并赋值const obj = { name: 'momo', age: 18}const {name: name2, age} = obj// 相当于声明name2, 并且值为obj.name / 即为 const name2 = obj.nameconst obj2 = {name2, age}// 相当于const obj2 = {name2: name2, age:age}/ 因为ES6的key/value一样可以简写其实

2022-05-10 13:59:27 1007

原创 js 计算两个时间之间过了几年几月几日

这种需求就很离谱，因为一般情况时间的计算最好是转为毫秒值计算，这样计算精确，但是要计算过了几年几月几日，就不能用毫秒值，JAVA中能直接用方法计算，JS中没有方法：先取出年份，月份，年份，各自算出差值，为复数，向前减一，代码以VUE为例 /** * 计算当前时间和传入时间间隔几年几月几日, 并返回相应格式 * @param val */ setCompareRegistrationTimeText(val) { if (!v

2022-04-29 20:30:00 1969

原创 css 修改audio标签样式

今天拿到一个需求是做一个音频播放器，因为UI图与原本的样式就很像，所以直接改原本的样式就可以了，看到有很多大佬是自己写样式然后用js获取音频的各种事件方法，控制样式html5 audio样式修改,HTML5中 audio的样式设置_只吃回头草的博客-优快云博客直接在样式表中设置对应的样式：audio::-webkit-media-controls-panelaudio::-webkit-media-controls-mute-buttonaudio::-webkit-media-controls-pl

2022-04-19 19:45:00 8825

原创 vue 中使用 video 标签链接为OSS地址，有些显示音频时长有些没有

HTML5 video 标签控制板时长显示问题

2022-04-19 14:57:39 737

原创 HTML5 新属性contenteditable

今天偶然看见这个属性，可以把一个div,span,td等元素聚焦的时候可以直接变成输入框，改里面的数值，失焦的时候变成原来的元素，内部的值改了<div contenteditable="true">123241</div><span contenteditable="true">7787484span</span> <table border="1"> <tr> <th>Month</th&gt

2022-04-12 20:45:00 222

原创 VUE循环 + CSS 实现布局

实现样式图：<div class="tool-figure-note-box"> <div v-for="(figureNoteItem, figureNoteIndex) in list" :key="figureNoteIndex"> <template v-if="figureNoteItem.show"> <div class="figure-note-title">{{ figureNoteItem.ti

2022-04-09 14:45:00 884

原创 CSS选择器 :first-of-type/:last-of-type/ :first-child/:last-child 用法

官方链接：CSS3 :first-of-type 选择器 <div class="parent"> <span class="child child1">child1</span> <span class="child child2">child2</span> <div class="child child3"> child3 <div>child3-1</div>

2022-04-07 11:42:12 1116

转载 js 算法-斐波那契数(动态规划)

题目：F(0) = 0，F(1)= 1F(n) = F(n - 1) + F(n - 2)，其中 n > 1给定n ，请计算 F(n) 。解题方法：1、将方程式带入代码中function ceshi(n) { if (n<=1) { return n; }else { return ceshi(n-1)+ceshi(n-2); }}console.log('ceshi:' + ceshi(20)) // 67652、上述..

2022-03-25 18:28:06 226

原创 js 数组逆序--异或运算

异或运算符：^运算法则：1.交换律（随便换像乘一样）：a ^ b ^ c === a ^ c ^ b2.任何数于0异或为任何数 0 ^ n === n3.相同的数异或为0: n ^ n === 0记得有一个经典面试题：不声明新变量交换两个数字的值let a = 5, b = 10;a = a + bb = a - ba = a - bconsole.log(a, b) // a = 10, b = 5用异或也可以let a = 5; b = 10;a =..

2022-03-24 18:45:20 709

原创 vue 事件修饰符.stop/.capture/.self

<div @click="clickDad"> 父 <div @click="clickSun">子</div></div> 点击子，先触发子，再触发父<div @click="clickDad"> 父 <div @click.stop="clickSun">子</div></div>点击子，只触发子，不触发父<div @click.cap...

2022-03-21 15:54:11 868

原创 js 节流和防抖

函数防抖(debounce)：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。函数节流(throttle)：高频事件触发，但在n秒内只会执行一次，所以节流会稀释函数的执行频率。函数节流（throttle）与函数防抖（debounce）都是为了限制函数的执行频次，以优化函数触发频率过高导致的响应速度跟不上触发频率，出现延迟，假死或卡顿的现象。之前一直用的underscore里面自带的_.debounce和_.throttle,仔细研究了一下一般情况： .

2022-03-21 14:20:14 370

原创 vue2 elememtUI 中Notification的自定义

遇到了一个需要使用Notification，但是Notification 内需要自定义按钮，执行各自的方法看了elementUI的文档，Element - The world's most popular Vue UI frameworkElement，一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库https://element.eleme.cn/#/zh-CN/component/notification支持html和VNode将dangerouslyUseHTMLS

2022-03-08 14:32:32 1826 5

原创 css 一些容易忘记的设置

/*鼠标禁用*/cursor: not-allowed;/*禁止文中选中*/-moz-user-select: none;-webkit-user-select: none;-ms-user-select: none;user-select: none;/*单行文本溢出省略号*/overflow: hidden;text-overflow:ellipsis;white-space: nowrap;/*2行文本溢出省略号*/display: -webkit-box;-webk.

2022-03-01 14:26:49 60

原创 js Promise.all()内部循环调同一个函数拿到所有结果返回

场景：需要循环执行一个异步函数，拿到所有的结果后再执行后面的操作在网上找了好多，好像都不是特别能用，自己摸索了一下搞了出来，但是也不知道原理是什么，以vue框架为实例，代码如下: ajaxPost(args) { // return 一个promise对象 const obj = {} return new Promise((resolve, reject) => { console.log(args) resolv.

2022-02-24 14:46:32 1390

原创 vue2 使用 window.open()打开新页面监听不到vuex的数据变化

A页面 window.open() B页面， B页面computed 里面的值取store里面的值，A页面操作改变值，B页面 watch 不到该值的变化解决办法：存在local里面，然后监听storage修改, 但是这个只能解决A页面修改值B页面才能监听到，而如果B页面修改这个storage的值也不会被该方法监听到，太emo了，其实B页面改值 computed: { ...mapState('ceshi', { vuexValue: state => state.v

2022-02-24 09:19:38 2107

原创 HTML的DOM中innerHTML,innerText,textContent,nodeValue的区别

参考文章：Day21 - innerText、 nodeValue与 textContent的区别 - 掘金四个都是取文本内容代码如下<div id="ceshi"><div>1</div> <style> .ceshi1 { height: 12px: width12px; border: 1px solid #000; } .ceshi2 { display: non.

2022-02-14 11:25:10 346

原创 vue2x版本index.html种获取环境变量

在vue文件中可以直接用 process.env.VUE_APP_xxx 获取到自定义环境变量，但是在index.html中只能使用<%= VUE_APP_xxx %> 字符串获取到，之前看到网上说的直接写在html中直接写：如下图，但是内部也获取不到环境变量process <% if (process.env.VUE_APP_environment === 'production' ) { %> <script> // js 代码 .

2022-02-11 10:24:23 5936 3

原创 vue2页面data中的数据放在return和不放return的区别——页面性能提升

公司项目做地图，20w的点标记，导致页面超级卡，后面发现是因为将地图和地图上所有的东西全部定义在了data的return中，后面改了之后发现页面流畅了很多<button type="primary" @click="clickA">{{a}}</button><button type="primary" @click="clickB">{{b}}</button>data() { this.a = false const arr =

2022-02-09 11:18:06 3344 1

原创 css 子元素设置浮动父元素高度没有解决办法

css 子元素设置浮动父元素高度没有---解决办法

2022-02-01 12:07:15 1157

原创 vue2+高德地图加遮罩,一些marker显示在遮罩上，一些在遮罩下

// 遮罩的z-index是300,路线是301，marker是302highLightPoint.initialIndex = highLightPoint.getzIndex();highLightPoint.setzIndex(302);项目需求：高德地图上加一个遮罩，画一堆marker，一些marker在遮罩上,一些marker在遮罩下，效果如下图通过强制修改css样式实现遮罩放的位置,如上图，找到元素添加遮罩层const amapLayerDom = docume..

2021-09-22 17:28:22 1525

momo_mom177的博客

原创 element ui 穿梭框支持树形结构(仅支持2层)

原创 elmentui-table 点击收缩展开

原创 js 下载pdf且重命名

原创 vue 使用 pdfh5 展示PDF文件

原创 js 输入年龄判断年龄阶段

原创 element-ui 表格(table)合并表头下面合并列且可以收缩展开

原创 js 判断时间段中间是否存在周几

原创 JS 实现计算字符串的实际宽度

原创 css 实现聊天框样式

原创前端使用CryptoJS加密解密

原创使用js动态控制html页面缩放

原创使用js动态设置svg的颜色和宽高

原创 element-ui 的table的fixed在旋转后rotate之后布局计算在手机上有问题

原创 css动画——...陆续出现表示进行中

原创原生嵌套H5，HTML中input标签输入没特殊设置从右往左输入

原创 Vue中强制组件重新渲染

原创 js 从原来的对象取出需要的key组成一个新对象，并且更换变量名