前端知识
文章平均质量分 70
SunnyRun!
以认真的态度去持有,用最佳的方式去探索。
展开
-
vue实现自定义实现树形控件treejs
说明:支持点击创建远程数据,loadDataAjax方法,需要自己研究功能小编已实现;针对多层级的列表,我们采用tree的方式,从根节点一次创建绑定子节点的方式,可以递归式的调用本身,对我们的树形结构进行展示;1、创建TreeList文件夹,其中创建:fonts文件夹、index.js文件、tools.js文件、Tree.js文件、VueTreeList.vue文件;近期的一个功能需求,实现一个树形结构:可点击,可拖拽,右侧数据可以拖拽到对应的节点内,可创建文件夹、可创建文件、编辑文件名、可删除等等;原创 2023-08-24 17:46:58 · 2250 阅读 · 0 评论 -
vue自定义穿梭框支持远程滚动加载
技术框架公司的选型(老项目):vue2 + iview-ui方案的实现思路是共性的,展现UI样式需要你们自定义进行更改;因为iview是全局注入,基本使用原先的类名进行二次创建公共组件,修改基础js实现逻辑;原创 2023-08-14 18:47:50 · 775 阅读 · 0 评论 -
前端js实现正则表情包内容替换、前端表情包实现
表情包实现思路:通过全局正则针对文本内容走查,匹配到[嘿哈]文本表情包,通过创建div或者img标签,包裹将文本表情包替换成我们表情包的地址链接。// 创建文件emoticon.jsimport lottie from "lottie-web"; // 动画方法const lottieWrap = {};const emoticon = new Map([ ['[大笑]', { name: 'daxiao', src: 'https://url-daxiao.json'原创 2021-09-08 18:24:14 · 1689 阅读 · 0 评论 -
react hooks原理实现方式
它是一个被称作为代数效应的思想。代数效应是函数式编程中的一个概念,用于将副作用从函数调用中剥离出去。函数式组件本身是一个函数,那么在函数式编程中有一个理念就叫做代数效应。原创 2021-05-20 15:53:06 · 1259 阅读 · 5 评论 -
vue实现语音旁边的音波效果
前端实现语音录制功能背景:在H5页面实现移动端的语音录制,需要实现写相关的css波纹效果。代码片段<template> <div class="sound-sonic_wave"> <div class="wave w1"></div> <div class="wave w2"></div> </div></template><style lang="less" sc原创 2021-05-20 14:49:19 · 1559 阅读 · 0 评论 -
vue实现搜索功能
前言:最近小编也是刚跳槽新的公司一个月,前端技术栈是vue+element也是市面上比较常用的框架之一了,同时也花费一点时间总结一下最近的坑,react转vue的一个过程确实是有些心累的,其主要原因还是写法的不同吧。需求:前端实现页面的筛选列表,是多条件的;what?后端不自己做页面的筛选搜索功能,怎么让前端做这样的一个功能点的实现,可能小编太老实了吧。无所谓,不纠结这些,那就分析一下需求...原创 2019-06-05 12:07:37 · 19769 阅读 · 6 评论 -
webpack配置-相关属性说明
前言:webpack是我们现代前端最常见的模块打包工具,webpack 是一个模块打包器,主要目的是在浏览器上打包 JavaScript 文件。特性:打包 CommonJs 和 AMD 模块(以及绑定),可创建单个或多个按需加载的块,以减少初始加载时间,在编译期间会解决依赖关系,减少了运行时的大小,加载器可以在编译时预处理文件,如 coffee-script 到 javascript。小编也是从闲余时间零开始搭建webpack,作为演示讲解一些常用的功能块和属性方法1. 代码示例 webpack.b.原创 2020-07-10 17:43:21 · 1272 阅读 · 0 评论 -
前端javascript设计模式讲解理解
享元模式的核心是运用共享技术来有效支持大量细粒度的对象,减少对象的使用,间谍内存分配.主要解决大量对象带来的性能问题,减少重复的内部或外部变量创建,比如:根据不同type创建不同类,但是会有相同type 如果相同返回之前创建的对象类。使得程序中多了一些节点对象,可能在某一次的请求传递过程中,大部分 节点并没有起到实质性的作用,它们的作用仅仅是让请求传递下去,从性能方面考虑,我们要避 免过长的职责链带来的性能损耗。通过增加一个中介者对象,让所有的相关对象都通 过中介者对象来通信,而不是互相引用。原创 2020-03-25 18:52:05 · 155 阅读 · 0 评论 -
vue中axios的二次简易封装
第一步:配置axios首先,创建一个request.js,这里面存放的时axios的配置以及拦截器等,最后导出一个axios对象。我平常elementUI用的比较多,这里你也可以使用自己的UI库(本文章使用的是element-ui)。util/request.js 文件import Vue from 'vue';import axios from 'axios'import rout...原创 2020-03-19 10:48:34 · 228 阅读 · 1 评论 -
vue组件库的开发流程
开发流程1.创建项目,(vue-cli/公司现有架构)2.调整项目静态目录结构3.使用webpack相关库模式打包编译4.使用npm或者公司源地址发布到你需要的平台步骤创建项目,省略;调整项目静态目录结构在项目同级目录下创建lib文件夹 => assets / components / css / utils / index.js / UploadUi.vue (依据...原创 2019-12-09 20:10:27 · 1067 阅读 · 0 评论 -
前端常用工具库方法整理
在闲余的时间整理一份我们可能用到的前端工具库方法。计算两个日期时间相差的年数、月数、天数、日期时间原创 2019-10-31 17:15:31 · 1746 阅读 · 1 评论 -
element基础详情页-文本描述组件
前言对于常做topB系统的小伙伴们,基础信息详情页是最常见不过的;也是我们最容易封装的,这里小编简易写了一点东西。使用只是做了简易版,相关参数并不支持render的写法;有兴趣的可以写写,支持render后扩展性会更好import DescriptionList from "./Description.vue"; // 引入组件<DescriptionList titl...原创 2019-08-21 16:44:34 · 23220 阅读 · 4 评论 -
vue项目中element-ui的表格table的二次封装
列表数据表格的json配置;而element-ui的table主要是以template的方式进行页面的渲染,容易造成业务代码可观性并不是很友好,维护也不是很方便;element-ui的成熟度、以及使用率很大,市场上面的大多封装也很多,可扩展性也很方便。这里小编也做了一套简易版的二次封装,希望能帮到各位小编也是前端小白,代码也有不合理之处,只是在闲余时间内简单写写,提升提升能力。以上代码可根据自己的项目去做调整。原创 2019-08-05 15:37:56 · 13779 阅读 · 1 评论 -
【24届前端春招面试题】2024前端面试进阶指南-前端面试题总结大集合
对称加密算法使用起来简单快捷,密钥较短,且破译困难,除了数据加密标准(DES),另一个对称密钥加密系统是国际数据加密算法(IDEA),它比DES的加密性好,而且对计算机功能要求也没有那么高与对称加密算法不同,非对称加密算法需要两个密钥:公开密钥(publickey)和私有密钥(privatekey)。4、http的连接很简单,是无状态的;也就是说,通过TCP连接传送的数据,无差错,不丢失,不重复,且按序到达;3、http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。原创 2019-01-17 10:48:47 · 22850 阅读 · 7 评论 -
React v16.3新生命周期、性能优化及注意事项
React Version: 16.3版本对组件的生命周期函数进行了一些修改,在每个react组件中都有以下几个生命周期方法我们应该掌握最新生命周期,学以致用,以达到性能优化的目的。1.生命周期的可视化,一张图看懂最新版React生命周期的特性,渲染动作。2.相比之前React版本,总结去掉了3个方法:componentWillMountcomponentWillRecei...原创 2019-01-11 15:31:17 · 928 阅读 · 1 评论 -
ant design中如何在表头中加个Icon和排序,悬浮icon又触发Tooltip
需求:ant design中的table中的thead支持**信息提示**和远程加载**排序**。![在这里插入图片描述](https://img-blog.csdnimg.cn/20181211170441113.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9n...原创 2018-12-11 18:05:48 · 14792 阅读 · 4 评论 -
ant design Table实现可编辑的单元格
需求最近接到的一个需求,在table栏中实现属性的可编辑单元格,并且table内部动态可动态删减的单元格,外部操作新增或删除一行新旧数据的操作,无交互的前端实现,这篇文章希望对你有帮助。想法或思路如何去实现这一功能,table无非是增删改查,现在只不过是从交互中抽离成前端的增删改查,增我们会想到 Array 的 push方法,删就是 slice 、splice等等。1、规则模块单独抽...原创 2018-12-21 21:06:09 · 28180 阅读 · 1 评论 -
mac解决Enter passphrase for key每次输入密码
公钥 私钥当我们关联好自己的git时,发现每次pull 或 push代码时会让我们重复性输入自己的密码,问题不是出在我们关联的不对,而是对git的公钥和私钥了解并不深,使用命令ssh-keygen,默认生成的公钥名为id_rsa.pub ,私钥名为id_rsa。$ cat ~/.ssh/id_rsa.pubssh-rsa AAAAB3NzaC1yc2EAAAABIwAAAQEAklOUpkD...原创 2018-11-06 21:38:58 · 13347 阅读 · 1 评论