自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+

埃尔斯的博客

一步一步揭开前端的小秘密

  • 博客(43)
  • 收藏
  • 关注

原创 奇技淫巧之判断入参是否为undefined

奇技淫巧之判断入参是否为undefined前言undefined的判断总结前言作为一个程序员,coding是每天必做的事情之一,今天埃尔斯在阅读腾讯AlloyTeam 的一个开源项目AlloyTouch,发现了一个有意思的小技巧,就是对undefined的精准判断。源码地址:https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_to...

2019-05-23 17:06:06 279

原创 ant.design.pro生产环境部署坑 --- 解决记

普通部署直接在根目录下直接在项目所在的cmd里npm run build 直接就解决问题。非根目录下的部署这就双双闹出点问题如果你直接按不同方法那样做,jenkins会成功,但是当你访问站点的时候就懵逼,站点会给你好多404,比如像下面的一样:也有可能他不报404了他会是这样的坑返回个空白页,资源也加载了,没有404,但是打开文件却如上图右边所示的提示,打开index.html会出现...

2019-03-27 15:01:35 11924 8

原创 ant-design-pro 动态菜单-路由详解

ant-design-pro 动态菜单-路由详解最近利用ant-design-pro开发项目要实现之前的项目嵌入到新项目里来,并且根据和后台的接口返回的数据显示侧边栏菜单。既然是是利用别人的架构那当然是从文档中找实现的方法,终于不负苦心人在https://pro.ant.design/docs/router-and-nav-cn文档那里找到初步的解决方法进入src/layouts/Basil...

2019-03-20 17:55:06 20365

原创 react+redux+ant+axios+iframe实现网站门户

一个框架壳子,技术栈react+redux+ant+axios+iframe,实现侧边栏与导航栏还有头部,对打开的页签进行缓存,使用iframe与各个子系统页面相连。对打开的页签进行缓存即使刷新页面的tag也不会丢失,界面如下:这个实现的功能是侧边栏收起和打开,系统全屏显示等功能,这只是一个练手项目,希望大家提建议和交流,如果新学者学习的话使用这个项目练手对react,特别是redux的理解...

2019-02-28 16:47:34 1684

原创 原生js深入理解系列(一)--- 对js原生选择器的认识

//源码----start<html><head><meta charset="utf-8"><title>IFE JavaScr

2019-02-12 17:34:16 1983 2

原创 原生js深入理解系列(三)--- 事件冒泡的分析以及如何防止事件冒泡

一、源码 // 源码—start<html><head><meta charset="utf-8"><title>IFE JavaScript Task 01</title&amp

2019-02-12 17:32:11 537

原创 原生js深入理解系列(四)--- 多个实例深入理解js的深拷贝和浅拷贝,多种方法实现对象的深拷贝

亲们为什么要研究深拷贝和浅拷贝呢,因为我们项目开发中有许多情况需要拷贝一个数组抑或是对象,但是单纯的靠=“赋值”并不会解决所有问题,如果遇到引用类型的对象改变新赋值的对象会造成原始对象也发生同样改变,而要去除影响就必须用到浅拷贝、深拷贝,深拷贝,对于引用对象需要进行深拷贝才会去除影响。如果是值类型直接“=”就好。简而言之:赋值:就是两个对象指向的内存地址一样,a=b赋值后的新对象也指向同一个存...

2019-02-12 17:23:09 582

原创 原生js深入理解系列(六)--- JavaScript中的继承超全实现方式

1)对象冒充红色里面三行代码最关键。相同方法会覆盖2)call方法方式《任何方法都有call()这个方法》call 方法是Function对象中的方法,因此我们定义的每个函数都拥有该方法。可以通过函数名来调用call方法,call方法的第一个参数会被传递给函数中的this,从第二个参数开始,逐一赋给函数中的参数。//使用call方式实现对象的继承function Parent(use...

2019-02-12 17:15:54 123

原创 原生js深入理解系列(五)--- 透析原型与原型链

概念:JavaScript 常被描述为一种基于原型的语言 (prototype-based language)——每个对象拥有一个原型对象,对象以其原型为模板、从原型继承方法和属性。原型对象也可能拥有原型,并从中继承方法和属性,一层一层、以此类推。这种关系常被称为原型链 (prototype chain),它解释了为何一个对象会拥有定义在其他对象中的属性和方法。JavaScript 只有一种结...

2019-02-12 16:32:42 378

原创 重学React基础知识整理——新增的生命周期函数(七)

新的生命周期函数全部函数,以及介绍各函数的特点、用法。着重介绍了新增的两个生命周期函数,并写了两个组件示例来帮助大家理解该函数的用法。

2022-06-14 18:06:15 227 1

原创 重学React基础知识整理——老的生命周期函数(六)

React老的生命周期的理解

2022-06-10 14:46:50 187

原创 重学React基础知识整理——组件间的另类通信“插槽”(五)

插槽、web组件中的插槽、vue中的插槽、react插槽,各种插槽的总结。

2022-06-01 16:51:49 699

原创 重学React基础知识整理——React组件通信(四)

学前知识准备props和state、受控组件和非受控组件在重学React基础知识整理——React组件是不是受?(三)这里有对相关知识做了比较详细的描述,请各位看管移步先看,先理解这些概念。第一种父子间的通信**1)父传子的通信,父组件中通过给子组件设置props属性传递给子组件。**如下面代码所示:其中props1,props2就是在父组件里传递给子组件Child的属性,在子组件中能够通过this.props这对象去展示出来。import React, { Component } from 'r

2022-05-31 16:54:05 188

原创 重学React基础知识整理——React组件是不是受?(三)

学前知识准备props和stateprops:props是从父组件那里继承的属性,自己组件内不可改变,只能在父组件进行修改,所以它是受父组件控制的。官方文档里描述“组件无论是使用函数声明还是通过 class 声明,都决不能修改自身的 props”。所以props是个牵线木偶是个乖乖崽父组件说什么就是什么。state:state是描述组件内的状态值,可以在组件内进行改变,每一次setState去改变state,会触发render()函数去重新渲染页面。注意不能直接进行赋值修改state。this.sta

2022-05-27 17:51:55 171

原创 重学React基础知识整理(二)

React是什么?官方文档上解释是:React 是一个声明式,高效且灵活的用于构建用户界面的 JavaScript 库。使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面,这些代码片段被称作“组件”。一个简单的react组件是怎么样的?在上一节我们创造一个react项目,现在我们创建的一个叫做HelloWorld.js的react组件,在App.js里引入该组件就行,引入代码为使用es6的import去引入,具体代码如下:import HelloWorld from './co

2022-05-24 18:45:42 280

原创 重学react基础整理——环境准备(一)

环境准备(1)直接使用官方提供的浏览器编辑方法,在浏览器中编辑代码,可以直接编码试一试。浏览器编码地址(2)搭建本地开发环境。a、这个需要安装node环境(如果没有安装node环境可直接去node官网下载),下载完后直接点击安装,直接下一步,下一步就好。b、 安装完后,到cmd 控制台直接输入:node -v 如出现下面结果就表示安装成功,只是每个人的版本号不同而已,我的是14.15.1,列位的可能为其他版本号。c、到自己想要开发项目的目录下打开cmd控制台,即直接到该文件夹路径那里直接输入cm

2022-05-24 15:46:47 187

原创 js中对象属性和类属性

这里写自定义目录标题js中对象属性和类属性上述代码用es7的写法写出来总结js中对象属性和类属性面试中经常遇到这个样的小面试题如下所示class Test{ a= 1 // 对象属性}Test.a = 10 // 类属性console.log(Test.a)//10let obj = new Test() // 对象属性要new()之后才能取得到console.log(obj.a) // 1console.log(Test.a,obj.a) // 10 1 这里是不是大家有疑问,不是a已

2022-05-23 16:31:15 440

原创 排序,按最大的排序

1,es6里面Math.max(…Arr)实现取最大值通过,闭包和自函数实现,实现方法如下:var arr = [23, 45, 40, 30, 12];var func = (datas) => { var result=[]; return function deal(data){ let len=data.length if(len>1){ ...

2019-10-21 13:28:42 389

原创 奇技淫巧之判断入参是否为undefined

2019独角兽企业重金招聘Python工程师标准>>> ...

2019-05-23 17:33:00 377

原创 angular4+rxjs订阅发布者模式实现组件中通信

2019独角兽企业重金招聘Python工程师标准>>> ...

2019-05-17 15:57:00 822

原创 vscode里利用prettier插件实现ant-design-pro架构代码的格式化

这里写自定义目录标题欢迎使用Markdown编辑器一、给vscode编辑器安装prettier插件。二、配置IDE编辑器的配置。欢迎使用Markdown编辑器你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。一、给vscode编辑器安装prettier插件。打开IDE...

2019-05-13 10:38:19 6989

原创 ant-design-pro 动态菜单-路由详解

最近利用ant-design-pro开发项目要实现之前的项目嵌入到新项目里来,并且根据和后台的接口返回的数据显示侧边栏菜单。既然是是利用别人的架构那当然是从文档中找实现的方法,终于不负苦心人在https://pro.ant.design/docs/router-and-nav-cn文档那里找到初步的解决方法进入src/layouts/Basilayout.js在官网中直接复制该代码,将原文件替换...

2019-03-20 18:11:00 3437 2

原创 vue2 + elementUI 中table表头加复选框图标

前言: 最近做一个项目,要在表头加一个复选款控制表格里数据的switch.效果图如下:没选中的时候如下图选中的时候要实现这样的效果必须解决两个问题,一、给表格表头加上复选框的图标二、通过复选框控制子元素三、复选框的初始化问题实现一我们要用到element提供的 :render-header=“renderHeader”,这个render-header属性,它是对应一个functi...

2019-03-14 17:43:48 4914

原创 vue2 + elementUI 中table表头加复选框图标

开发十年,就只剩下这套架构体系了!>>> ...

2019-03-14 17:40:00 7057

原创 使用ant.design时遇到要格式化Table行的内容的小小解决方法

开发十年,就只剩下这套架构体系了!>>> ...

2019-02-28 17:21:00 1803

原创 使用ant.design时遇到要格式化Table行的内容的小小解决方法

使用ant.design时遇到格式化行的内容问题:问题:在大家进行开发的时候,要造一张表格,表格UI设计的格式和后台返回的数据的格式往往不一样,这个时候就需要我们前端人员去发挥聪明才智了。往往第一想到的解决方法是在接口返回数据的时候直接对原数据进行处理,这样如果只是展示的话能解决问题,但是修改了原数据如果后面需要用到这些数据有可能会出现问题,所以一般不建议这样改。一般推荐改的是直接在UI上...

2019-02-28 15:58:51 3373

原创 关于js中delete 操作符的秘密(如何删除对象的属性,清空对象)

开发十年,就只剩下这套架构体系了!>>> ...

2019-02-14 15:29:00 19743

原创 关于js中delete 操作符的秘密(如何删除对象的属性,清空对象)

概念再mdn中detele的概念如下。delete 操作符用于删除对象的某个属性;如果没有指向这个属性的引用,那它最终会被释放。对于文字的理解我们有时有点不解其意,直接上代码更适合我们的style.eg:var parsent = {son: ‘jim’,children:[‘jim’, ‘bob’]}console.log(parsent.son,‘删除前’)delete p...

2019-02-13 17:28:25 4966

原创 原生js深入理解系列(二)--- js数组(数组的相应方法es6,es5)

一、源码//源码 — start<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>IFE JavaScript Task 01</title&

2019-02-12 17:45:32 339

原创 angular4 + ts + es6 自造轮子,理解组件化操作。以及怎么应用一些需要数据展示的组件

1、为什么要将某个功能块拿出来做成一个组件。2、改组件应该考虑哪些可塑性或者或使用者怎么进行自定义。3、组件实现了什么功能?4、怎么使用组件与当前的程序嵌合eg:下拉选组件的制造一、造组件webstrom 的cmd(左下角的灰色方块点开选terminal)控制台可以快速创建组件。html代码<button class=“btn btn-outline-primary s...

2019-02-12 17:42:09 452

原创 angular4学习笔记

1.响应用户时间 使用HostListener装饰器添加两个事件处理器,它们会在鼠标进入或离开时进行响应。eg: @HostListener(‘mouseenter’) onMouseEnter() { this.highlight('yellow');}@HostListener(‘mouseleave’)onMouseLeave(){ this.highlight(null);}...

2019-02-12 17:40:22 339

原创 git创建关联的父子仓库

一、新建两个git仓库,建立一个负责业务的master仓库,一个业务模块需要依赖的公共common仓库。二、正常拉取主仓库的代码到本地git clone ssh://git地址三、进入主仓库,并添加子仓库git submodule add ssh://git地址.git lib//添加成功后主仓库根目录增加了.gitmodule文件、、、、、、检出3.5:如果是克隆已经存在...

2019-02-12 17:09:21 1106

原创 原生js深入理解系列(七)--- 读JavaScript 执行机制的一点小总结

总结:js的执行机制是:单线程运行,主线程跑任务,线程队列一个一个宏任务来运行,并且把宏任务内的微任务的全部运行完再继续下一个宏任务。首先是同步执行其次是异步执行除了广义的同步任务和异步任务,我们对任务有更精细的定义:macro-task(宏任务):包括整体代码script,setTimeout,setIntervalmicro-task(微任务):Promise,process.ne...

2019-02-12 17:02:08 163

原创 原生js深入理解系列(五)--- 透析原型与原型链

开发十年,就只剩下这套架构体系了!>>> ...

2019-02-11 17:05:00 202

原创 从块级元素和行内元素的分析到bfc的布局理解

开发十年,就只剩下这套架构体系了!>>> ...

2019-01-25 18:24:00 453

原创 angular4学习笔记

开发十年,就只剩下这套架构体系了!>>> ...

2018-11-26 16:43:00 151

原创 angular4 + ts + es6 自造轮子,理解组件化操作。以及怎么应用一些需要数据展示的组件...

开发十年,就只剩下这套架构体系了!>>> ...

2018-11-26 16:34:00 314

原创 Vue webpack配置跨域的基本配置和问题的注意

开发十年,就只剩下这套架构体系了!>>> ...

2018-11-20 18:05:00 374

原创 git创建关联的父子仓库

开发十年,就只剩下这套架构体系了!>>> ...

2018-11-20 17:22:00 2074

原创 原生js深入理解系列(三)--- 事件冒泡的分析以及如何防止事件冒泡

开发十年,就只剩下这套架构体系了!>>> ...

2018-11-20 16:44:00 260

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除