Zyrzka-优快云博客

原创 el-dialog被遮罩层覆盖的问题：测试是由毛玻璃效果引起

mark一个比较奇怪的问题，开发的时候父元素有个毛玻璃效果的打底backdrop-filter: blur(10px);，然后其中写dialog的话，出现的dialog就回被遮罩层遮住，不知道是什么理论，但是经过实验确实是这个结论两种解决办法1、modal设置为false，直接去除遮罩层2、把毛玻璃效果的实现移到和dialog平级去实现效果，总之别让写有毛玻璃样式的元素嵌套dialog...

2022-03-01 18:09:28 453 1

原创 js防抖节流

防抖所谓防抖，就是指触发事件后在 n 秒内函数只能执行一次，如果在 n 秒内又触发了事件，则会重新计算函数执行时间，自己的理解就是不停的触发事件是不会执行函数的，触发结束一段时间后才会执行//防抖function debounce(fn,wait=1000){ let timer return function(...args){ if(timer)clearTimeout(timer) timer = setTimeout(() => { fn(this,a

2021-10-24 16:54:38 307

原创手写实现reduce()

1、reduce函数介绍定义：reduce() 方法接收一个函数作为累加器，数组中的每个值（从左到右）开始缩减，最终计算为一个值。array.reduce(function(prev, cur, index, arr), initVal)参数介绍：callback 必要参数，回调函数 prev 上一步的结果 cur 当前的值 index 当前值的index arr 当前数组

2021-09-02 20:58:04 1652

原创 vue-router原理/手写实现简单vue-router

main.jsimport Vue from 'vue'import App from './App'// import router from './router'//采用自己的路由组件import router from './zrouter'Vue.config.productionTip = false/* eslint-disable no-new */new Vue({ el: '#app', router, components: { App }, tem

2021-08-08 14:23:29 321

原创手写实现promise，promise.all，race等的实现

一步一步，直接开始，yeah！1、首先来个架子，几大件先摆上，首先是状态三个，方法两个（resolve和reject），then方法。//弄点变量当作状态，假装很高级的样子const PENDING = 'pending'const FULFILLED = 'fulfilled'const REJECTED = 'rejected'// 开始了class myPromise{ constructor(exec){ //状态初始化为pending this.state

2021-03-29 12:24:06 434 1

原创 el-table表头错位问题

情景：自己设置了el-table的height属性，数据较多时，表格出现滚动条，导致表头和表身有些错位解决办法：el-table提供了重绘方法，只需在数据获取之后调用nextTick执行此方法执行之后就会对齐this.$nextTick(() => { this.$refs.table.doLayout()})这样就ok了了了了了～...

2021-03-12 10:32:29 663

原创 safari 下 el-table 表格错乱问题

css设置如下，别问为啥好的，问我也不知道呜呜呜body .el-table th.gutter { display: table-cell !important;}body .el-table colgroup.gutter { display: table-cell !important;}table { width: 100% !important;}.el-table__body { // 使表格兼容safari，不错位 width: 100%; t

2020-09-19 17:04:10 715

原创浏览器js视频播放器外挂srt字幕（vue为例）

这里以vue为例啦第一次外挂字幕需求，mark一下～一、主要函数，将文本转化为易用的数组1、获取srt内容（本次srt是get获取的） async getSrt(url,index){ let srtText = await fileApi.getStr(url) if(srtText.success){ let srtItem = this.createSrtArr(srtText.data) //对应的多种语言的srt字幕的map，序号为k

2020-08-28 15:29:56 3873 9

原创 element-ui在vue-cli下按需引入

1、全局安装elementnpm i element-ui -S2、安装npm install babel-plugin-componentnpm install babel-plugin-component -D3、改写.babelrc文件{ "presets": [ ["env", { "modules": false, "target...

2019-03-18 14:00:25 264

原创安装tailwindcss

https://flaviocopes.com/vue-tailwind/安装时创建tailwind.js文件命令斜杠换成相反方向配置postcss.config.js时若有影响的js删除

2019-03-18 12:48:31 1642

原创浮动引起的div显示混乱

在混乱的div前加上<div style="clear: both;"></div>有的就能好了

2018-07-18 08:47:38 692

原创简单的注册表单

<!DOCTYPE html><html><head> <title>注册界面</title> <meta charset="utf-8"></head><body bgcolor="#caffff"><h1

2018-07-17 08:59:40 343

Zyrzka的博客