04 2020 档案
优秀的基于VUE移动端UI框架合集
摘要：1. vonic 一个基于 vue.js 和 ionic 样式的 UI 框架，用于快速构建移动端单页应用，很简约，是我喜欢的风格 star 2.3k 中文文档 在线预览 2.vux 基于WeUI和Vue(2.x)开发的移动端UI组件库 star 10k 基于webpack+vue-loader+vu
阅读全文
微信h5静默、非静默授权获取用户openId的方法和步骤
摘要：一、openId是什么？openId是用户在当前公众号下的唯一标识（‘身份证’），就是说通过这个openId，就能区分在这个公众号下具体是哪个用户。 二、openId有什么用？ 假如用户A在当前公众号下购买了一件商品，用户的下单信息肯定要存储到后台数据库，那根据什么进行存储呢？openId是用户在当
阅读全文
vue实现左侧滑动删除
摘要：IM截图20190605174729.jpg 直接封装成组件，多处可以调用，话不多说，上代码 <template> <div class="container"> <ul> <li class="list-item " v-for="(item,index) in list " data-type=
阅读全文
vant框架的select下拉框
摘要：vant似乎没有直接提供传统的select下拉框，我的意思是，单行单元格然后点击出现下拉框，样式和其他input统一。 今天做了一下，记录一下子，以免后面忘记 1.需求 input focus下出现下拉框，选中选项后 值绑定给field 2.html部分 圆圈处是控制底部抽屉是否显示 3.data和
阅读全文
【html】巧妙解决input标签自动填充问题
摘要：前言：如果是同域名网站，并且曾经在该网站下登录过账号密码，并且选择了记住账号密码。chrome浏览器会对账号密码进行自动填充功能，虽然这功能给我们提供了很多方便，但是也带来了些困扰。 一、问题起始①当“密码”那项input的type是text的时候并不会出现问题 <label> <span>卡号:<
阅读全文
【Vue】v-if与v-show的区别
摘要：相同点：v-if与v-show都可以动态控制dom元素显示隐藏 不同点：v-if显示隐藏是将dom元素整个添加或删除，而v-show隐藏则是为该元素添加css--display:none，dom元素还在。 都修改为false后，第一个div是直接被移除掉了 需要注意的是，当一个元素默认在css中加了
阅读全文
纯CSS属性pointer-events：none解决滚动穿透、事件穿透问题
摘要：·什么是滚动穿透： 在移动端的前端开发中，我们常常会用到Modal弹窗，又称模态框，用来在已有页面显示新的选项、提示或新内容。遮罩层常出现在弹窗后，用来在视觉上，帮助用户集中注意力，功能上，防止用户继续操作页面上的其他内容。遮罩层通常是一个绝对定位，宽高充满内容区域或可视区域，层级略低于弹窗的具有一
阅读全文
element中el-cascader使用props设置value、label、children
摘要：从后端拿到arr数据结构： cityList: [ { id: 1, name: '北京', child: [ id: 11, name: '大兴区', child: [ id: 111, name: '亦庄' ] ] }]vue文件代码 <el-cascader :options="cityLis
阅读全文
es6数组方法find()、findIndex()与filter()的总结
摘要：find() 该方法主要应用于查找第一个符合条件的数组元素。它的参数是一个回调函数。在回调函数中可以写你要查找元素的条件，当条件成立为true时，返回该元素。如果没有符合条件的元素，返回值为undefined。 以下代码在myArr数组中查找元素值大于4的元素，找到后立即返回。返回的结果为查找到的元
阅读全文
es6之扩展运算符 三个点（...）
摘要：es6之扩展运算符 三个点（...）es6之扩展运算符 三个点（...）对象的扩展运算符数组的扩展运算符总结es6之扩展运算符 三个点（…）对象的扩展运算符理解对象的扩展运算符其实很简单，只要记住一句话就可以： 对象中的扩展运算符(...)用于取出参数对象中的所有可遍历属性，拷贝到当前对象之中 le
阅读全文
Vue3 和vue2 的响应式有什么区别，Proxy 无敌？（面试热门，源码详解）
摘要：前言 大家都知道，Vue2 里的响应式其实有点像是一个半完全体，对于对象上新增的属性无能为力，对于数组则需要拦截它的原型方法来实现响应式。 举个例子： let vm = new Vue({ data() { return { a: 1 } } }) // ❌ oops，没反应！ vm.b = 2 l
阅读全文
字节跳动面试官：请你实现一个大文件上传和断点续传
摘要：前言 这段时间面试官都挺忙的，频频出现在博客文章标题，虽然我不是特别想蹭热度，但是实在想不到好的标题了-。-，蹭蹭就蹭蹭 :) 事实上我在面试的时候确实被问到了这个问题，而且是一道在线 coding 的编程题，当时虽然思路正确，可惜最终也并不算完全答对 结束后花了一段时间整理了下思路，那么究竟该如何
阅读全文
TypeScript 参数简化实战（进阶知识点conditional types，中高级必会）
摘要：TypeScript中有一项相当重要的进阶特性：conditional types，这个功能出现以后，很多积压已久的TypeScript功能都可以轻而易举的实现了。 那么本篇文章就会通过一个简单的功能：把 distribute({ type: 'LOGIN', email: string }) 这样
阅读全文
五种可视化方案分析 webpack 打包性能瓶颈
摘要：前言 在上两章节中我们已经介绍过了 JavaScript 打包机制 以及 webpack 所有的内置配置，但当项目业务功能达到一定规模时，默认的配置已经不足以满足开发、用户的期望，我们就需要对 webpack 配置进行优化。 关于优化，有几个基本规则： 首先知道要优化什么； 针对待优化点进行优化；
阅读全文
前端进阶算法：链表（+leetcode刷题）
摘要：引言 链表相对于数组来说，要复杂的多，首先，链表不需要连续的内存空间，它是由一组零散的内存块透过指针连接而成，所以，每一个块中必须包含当前节点内容以及后继指针。最常见的链表类型有单链表、双链表以及循环链表。 学习链表最重要的是 多画图多练习 ，没有捷径可循，在遇到链表问题时，瓶子君总结了一下，可以按
阅读全文
为什么 Vue 中不要用 index 作为 key？（diff 算法详解）
摘要：前言 Vue 中的 key 是用来做什么的？为什么不推荐使用 index 作为 key？常常听说这样的问题，本篇文章带你从原理来一探究竟。 本文的结论对于性能的毁灭是针对列表子元素顺序被改变、或者子元素被删除的特殊情况，提前说明清楚。 本篇已经收录在 Github 仓库，欢迎 Star： githu
阅读全文
VirtualBox虚拟机网络设置（四种方式）
摘要：原文地址： https://www.douban.com/group/topic/15558388/ VirtualBox的提供了四种网络接入模式，它们分别是： 1、NAT 网络地址转换模式(NAT,Network Address Translation) 2、Bridged Adapter 桥接模
阅读全文
抖音特效在 Web 端的实现
摘要：当下最火的短视频应用莫过于抖音了，凭借着丰富的视频特效，抖音吸引了很多年轻用户的青睐，今天我们来看一下，抖音特效如何在 Web 端实现。 核心原理 实现原理比较简单，总结起来有如下三个步骤： 1、使用预渲染 canvas 绘制 video 的每一帧画面。 2、将预渲染 canvas 作为纹理传到显存
阅读全文
前端滤镜
摘要：Filter 函数 注意: 滤镜通常使用百分比 (如：75%), 当然也可以使用小数来表示 (如：0.75)。 none 默认值，没有效果。 blur(px) 给图像设置高斯模糊。"radius"一值设定高斯函数的标准差，或者是屏幕上以多少像素融在一起， 所以值越大越模糊；如果没有设定值，则默认是0
阅读全文
ElementUI table标签如何让某一行默认展开
摘要：<template lang="html"> <el-table :data="tableData5" :row-key="getRowKeys" :expand-row-keys="expands" style="width: 100%"> <el-table-column type="expan
阅读全文
element-ui的el-tabel组件怎么使用type=“expand”实现表格嵌套并且在子表格没有数据的时候隐藏展开按钮
摘要：效果如下： 试过很多种办法，思路都在怎么控制<el-table-column type="expand">里面的type上，比如使用v-show等等，但是发现，要不就是展开图标全部没有，要不就是全部有，研究好久，终于想出来这么个办法： 使用getRowClass针对每一行添加类， getRowCla
阅读全文
