- 博客(31)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 爬坑！！antd中select组件的defaultValue取不到数据问题
爬坑！！antd中select组件的defaultValue相关问题需求一：是这样的，想要在下拉菜单的框里首先显示一个默认值，默认下拉菜单的第一项，而不是placeholder。但是由于下拉菜单是请求回来的数据，因为你不能在页面渲染的时候就直接展示出数据，所以有了一个解决办法！使用key！！！让key值等于defaultValue的值。const [activites, setActivites] = useState([]);...useEffect(() => { setActivit
2021-10-25 15:02:24
4161
3
原创 redux基础入门学习总结
redux基础学习总结 redux是对状态统一进行管理，如果你的项目非常小，不需要使用redux。在开发过程中，如果你感觉你的状态不好管理，此时你就要想到，需要使用redux统一管理状态了。三大原则Redux 遵守下面三大原则：单一数据源在 Redux 中，所有的状态都放到一个 store 里面，一个应用中一般只有一个 store。在Redux这个对象上，有一个api，叫createStore，Redux.createStore就可以创建一个仓库。需要给仓库分配一个叫reducer
2021-08-03 15:41:28
185
原创 react基础入门级学习总结
react基础入门级学习总结组件 对于react来说核心是组件，声明组件有两种方式，**一种是通过类创建，一种是通过函数创建。**通过类创建的组件中可以放状态，这类组件叫有状态组件。通过函数创建的组件不可以放状态，这类组件叫无状态组件。通过类创建一个组件：<script type="text/babel"> class MyHeader extends React.Component{ render(){ // 需要返回一个jsx
2021-08-03 15:37:26
156
原创 react hooks初学者入门总结
react hooks 学习之路近期接触react hooks，在这里总结一下学习之路。总的来说，react hooks的学习就是几个方法的学习，废话不多说，起飞！useState之前写的类组件是有状态组件，我们通过setState去更改状态，但是hook是使用的函数组件，函数组件是无状态组件，但是我们想在函数组件中维护自己的状态，该怎么办？所以就遇到了useState这个方法，不仅可以维护自己的state,还可以通过state去控制UI的展示！import React, { useState }
2021-07-20 16:07:38
316
1
原创 React中父子传参以及兄弟传参
React中父子传参以及兄弟传参由于之前都是使用vue开发，今天遇到了这个react中父子传参的问题，所以就来研究一下。话不多说，直奔主题！父传子(通过props属性)直接上代码！父组件import React from 'react';import Children from './Children';class Father extends React.Component{ constructor(){ super(); } render(){
2021-07-19 17:06:47
491
原创 回流和重绘
回流和重绘浏览器的渲染过程本文先从浏览器的渲染过程来从头到尾的讲解一下回流重绘，如果大家想直接看如何减少回流和重绘，可以跳到后面。从上面这个图上，我们可以看到，浏览器渲染过程如下：解析HTML，生成DOM树，解析CSS，生成CSSOM树将DOM树和CSSOM树结合，生成渲染树(Render Tree)Layout(回流):根据生成的渲染树，进行回流(Layout)，得到节点的几何信息（位置，大小）Painting(重绘):根据渲染树以及回流得到的几何信息，得到节点的绝对像素
2020-11-30 21:47:54
144
原创 ES6新增新操作数组的方法
ES6新增新操作数组的方法1、find()：传入一个回调函数，找到数组中符合当前搜索规则的第一个元素，返回它，并且终止搜索。const arr = [1, "2", 3, 3, "2"]console.log(arr.find(n => typeof n === "number")) // 12、findIndex()：传入一个回调函数，找到数组中符合当前搜索规则的第一个元素，返回它的下标，终止搜索。const arr = [1, "2", 3, 3, "2"]console.log
2020-11-30 19:49:29
2618
原创 常用数组操作方法（未完待续）
常用数组操作方法一、concat()concat() 方法用于连接两个或多个数组。该方法不会改变现有的数组，仅会返回被连接数组的一个副本。var arr1 = [1,2,3];var arr2 = [4,5];var arr3 = arr1.concat(arr2);console.log(arr1); //[1, 2, 3]console.log(arr3); //[1, 2, 3, 4, 5]二、join()join() 方法用于把数组中的所有元素放入一个字符串。元素是通过指定的分隔
2020-11-30 19:45:04
239
原创 正则表达式完整总结，收藏起来
正则表达式完整总结，收藏起来1. 概述正则表达式（regular expression）是一种表达文本模式（即字符串结构）的方法。创建方式有两种方式：一种是使用字面量，以斜杠表示开始和结束。var regex = /xyz/另一种是使用RegExp构造函数。var regex = new RegExp('xyz'); 它们的主要区别是，第一种方法在引擎编译代码时，就会新建正则表达式，第二种方法在运行时新建正则表达式，所以前者的效率较高。而且，前者比较便利和直观，所以实际应用中，基本上都采
2020-11-30 19:21:57
637
原创 聊一聊JS的立即调用函数
聊一聊JS的IIFE定义IIFE: Immediately Invoked Function Expression，意为立即调用的函数表达式，也就是说，声明函数的同时立即调用这个函数。对比一下，这是不采用IIFE时的函数声明和函数调用：function foo(){ var a = 10; console.log(a);} foo();下面是IIFE形式的函数调用：(function foo(){ var a = 10; console.log(a);})();函数
2020-11-30 18:44:30
125
原创 js中attribute和property区别
js中attribute和property区别AttributeAttribute是HTML上设置的属性，在HTML中显式地设置，或者通过setAttribute()方法设置。比如这样一段HTML代码，实际上它有三个attribute属性，我们可以打印出来看看：对于Attribute而言，它有三个常用的方法setAttribute()、getAttribute()以及removeAttribute()：对于用setAttribute()和removeAttribute()方法设置和删除的属
2020-11-30 14:32:40
332
原创 快速、简洁讲明Vue中v-for循环key的作用
快速、简洁讲明Vue中v-for循环key的作用概要关于v-for中的key问题，其实这已经是个很常见的问题了，基本网上一搜一大把，面试的时候也常常会被问到，讲这个问题可能会设计DOM与虚拟DOM，还有很重要的Diff算法。作用(重头戏)我们都知道，Vue很大的一个特点就是双向数据绑定，数据一旦改变，那么页面就渲染新的数据呈现在页面上。那么问题来了，对于用v-for渲染的列表数据来说，数据量可能一般很庞大，而且我们经常还要对这个数据进行一些增删改操作。假设我们给列表增加一条数据，整个列表都要重新
2020-11-30 11:17:51
4560
1
原创 webpack的异步加载原理及分包策略
webpack的异步加载原理及分包策略webpack 异步加载原理webpack ensure 有人称它为异步加载，也有人称为代码切割，他其实就是将 js 模块给独立导出一个.js 文件，然后使用这个模块的时候，再创建一个 script 对象，加入到 document.head 对象中，浏览器会自动帮我们发起请求，去请求这个 js 文件，然后写个回调函数，让请求到的 js 文件做一些业务操作。举个例子需求：main.js 依赖两个 js 文件：A.js 是点击 aBtn 按钮后，才执行的逻辑，B.
2020-11-30 11:03:29
1308
原创 函数中的this的四种绑定形式 — 大家准备好瓜子，我要讲故事啦~~
函数中的this的四种绑定形式 — 大家准备好瓜子，我要讲故事啦~~【故事】有一个年轻人叫"迪斯"（this）,有一天，迪斯不小心穿越到一个叫 “伽瓦斯克利”（javascript）的 异世界，此时此刻迪斯身无分文， 他首先要做的事情就是——找到他的住宿的地方——调用函数的对象this的默认绑定【故事——线路1】如果迪斯（this）直到天黑前都没有找到能收留自己的住所，他眼看就要过上非洲难民的生活， 这时候，一位乐善好施的魔法师村长——window救世主一般地出现了：先住在我家吧！当一个函数没有
2020-11-29 20:44:42
269
原创 最全Vue知识点（基础到进阶，覆盖vue3）
最全Vue知识点（基础到进阶，覆盖vue3）基础篇说说你对MVVM的理解Model-View-ViewModel的缩写，Model代表数据模型，View代表UI组件,ViewModel将Model和View关联起来数据会绑定到viewModel层并自动将数据渲染到页面中，视图变化的时候会通知viewModel层更新数据Vue2.x响应式数据/双向绑定原理Vue 数据双向绑定主要是指：数据变化更新视图，视图变化更新数据。其中，View变化更新Data，可以通过事件监听的方式来实现，所以 V
2020-11-29 20:23:15
167
原创 CSS3新特性
CSS3新特性选择器:last-child /* 选择元素最后一个孩子 */:first-child /* 选择元素第一个孩子 */:nth-child(1) /* 按照第几个孩子给它设置样式 */:nth-child(even) /* 按照偶数 */:nth-child(odd) /* 按照奇数 */:disabled /* 选择每个禁用的E元素 */:checked /* 选择每个被选中的E元素 */:not(selector) /* 选择非 selector 元素的每个元素 */
2020-11-28 20:39:07
117
原创 H5新增特性
H5新增特性H5新增标签标签描述header定义了文档的头部区域footer定义了文档的尾部区域section定义文档中的节（section、区段）nav定义文档的导航aside定义页面的侧边栏内容article定义页面独立的内容区域detailes用于描述文档或文档某个部分的细节summary标签包含 details 元素的标题dialog定义对话框，比如提示框H5新增表单 Input 输入类型inp
2020-11-28 20:25:22
130
原创 跨域问题的思考
跨域问题的思考什么是跨域？首先我们需要知道什么是跨域，跨域指的是浏览器不能执行其它网站的脚本，它是由浏览器的同源策略造成的，是浏览器对JavaScript 施加的安全限制。协议，域名，端口，三者有一不一样，就是跨域如何解决跨域问题JSONP JSONP是JSON with Padding的略称。它是一个非官方的协议，它允许在服务器端集成Script tags返回至客户端，通过javascript callback的形式实现跨域访问（这仅仅是JSONP简单的实现形式）。response 添加
2020-11-28 17:47:47
88
原创 js中关于setTimeout异步的思考
js中关于setTimeout的思考首先看看下面的代码会打印出什么？ for(var i =0;i<5;i++){ setTimeout(function(){ console.log(i); },1000); }控制台在一秒后输出5次5这里和浏览器的事件队列和事件循环机制有关系。也就是说，setTimeout是一个宏任务，它在事件队列里排在了script标签这个宏任务的后面。浏览器会先执行第一个宏任务，也就是读取scri
2020-11-28 10:45:43
391
原创 localStorage和sessionStorage, session与cookie的区别
localStorage和sessionStorage, session与cookie的区别sessionStorage、localStorage和cookie的区别共同点：都是保存在浏览器端、且同源的区别：1、cookie数据始终在同源的http请求中携带（即使不需要），即cookie在浏览器和服务器间来回传递，而sessionStorage和localStorage不会自动把数据发送给服务器，仅在本地保存。cookie数据还有路径（path）的概念，可以限制cookie只属于某个路径下2、存
2020-11-26 15:14:58
51
原创 async/await到底是什么？怎么用？
async/awaitasync/await的优点1）方便级联调用：即调用依次发生的场景；2）同步代码编写方式： Promise使用then函数进行链式调用，一直点点点，是一种从左向右的横向写法；async/await从上到下，顺序执行，就像写同步代码一样，更符合代码编写习惯；3）多个参数传递： Promise的then函数只能传递一个参数，虽然可以通过包装成对象来传递多个参数，但是会导致传递冗余信息，频繁的解析又重新组合参数，比较麻烦；async/await没有这个限制，可以当做普通的局
2020-11-26 12:41:11
217
原创 关于闭包的思考
闭包如何产生闭包?2个函数嵌套内部函数引用了外部函数内的局部变量执行外部函数闭包是什么?包含了那个局部变量的容器它被内部函数对象引用着闭包的作用?延长局部变量的生命周期使函数外部可以多次间接操作到函数内部的数据闭包应用?循环遍历加监听IIFE定义模块jQuery内部代码演示: function fn1 () { var a = 2 function fn2 () { a++ consol
2020-11-26 11:12:16
53
原创 JS模块化与项目构建
JS模块化与项目构建1)谈谈你对js模块化的理解1)当工业级的项目开发的足够大的时候，如果将所有的js代码定义在一个js文件的话，使得复杂度提升，后期维护难度加大。2)如果将一个大的js文件根据一定的规范拆分成几个小的文件的话将会便于管理，可以提高复用性。3)模块化在项目中十分的重要，一个复杂的项目肯定有很多相似的功能模块，如果每次都需要重新编写模块肯定既费时又耗力。但是引用别人编写模块的前提是要有统一的“打开姿势”，如果每个人有各自的写法，那么肯定会乱套，所有会引出模块化规范的使用4)常用的J
2020-11-25 22:03:20
320
原创 Git合集
Git合集1)git最基本的6个操作1). 创建本地仓库创建.gitignore配置文件git initgit add *git commit -m “xxx”2). 创建远程仓库New Repository指定名称创建3). 将本地仓库推送到远程仓库git remote add origin https://github.com/xxxx/xxx.git 关联远程仓库（origin别名）git push origin master4). 如果本地有更新, 推送到远程git
2020-11-25 21:55:41
120
原创 JS小案例总结（JS基础案例）
JS小案例总结JS小案例总结案例一：JS实现tab选项卡功能案例二：JS实现盒子拖拽功能案例三：JS实现导航条吸顶效果案例四：JS实现图片懒加载结构案例五：JS实现简易弹幕功能案例六：JS实现自动滚动新闻列表JS小案例总结案例一：JS实现tab选项卡功能描述：纯原生js实现选项卡切换的效果,即当鼠标移入某个选项卡区域时,显示不同的内容。HTML代码如下：<body> <div id="tabs"> <div id="options">
2020-08-08 09:50:17
8037
5
原创 jQuery入门初识 未完待续···
jQuery入门初识一、jQuery初步了解1、定义：2、jQuery库包含哪些功能3、为什么使用jQuery4、jQuery的基本语法5、jQuery选择器6、常用的 jQuery 事件方法二、jQuery效果1、隐藏和显示动画2、滑动动画3、透明度动画4、自定义动画5、解除动画的排列机制三、JQ操作1、操作元素节点2、操作属性节点3、操作文本节点4、JQ操作CSS四、JQ中的事件1、 UI事件2、焦点事件：3、鼠标事件：5、键盘事件6、表单事件7、页面载入事件8、事件绑定9、事件委托一、jQuery初
2020-08-01 09:17:53
1659
2
原创 ES6小结（未完待续···）
ES6小结一、ES6简介1、什么是ES6？2、为什么使用ES6？二、ES6新增语法1、let2、const3、var、let、const的区别4、解构赋值5、箭头函数6、剩余参数三、ES6 的内置对象扩展1、Array 的扩展方法2、String 的扩展方法一、ES6简介1、什么是ES6？ES 的全称是 ECMAScript , 它是由 ECMA 国际标准化组织,制定的一项脚本语言的标准化规范。ES6 实际上是一个泛指，泛指 ES2015 及后续的版本。2、为什么使用ES6？每一次标准的诞生
2020-07-24 13:52:09
332
1
原创 JS函数基础题合集（未完待续）
JS函数基础题合集（未完待续）JS函數基礎題合集(1)1、利用函數的方法求1~100的累加和2、利用函數求任意兩個數的和(例如:1,2)3、利用函數求任意兩個數的最大值4、利用函數求一個數組[5,2,99,101,67,77]中的最大值5、利用函數求兩個數的加減乘除6、利用函數去除數組中的重複項7、利用函數實現簡單計算器8、利用函數輸出三個數的最大值並彈出9、利用函数翻转数组10、利用函數冒泡排序11、 利用函數判斷是否是閏年12、利用函數輸出某年份2月的天數（函數相互調用）JS函數基礎題合集(1)1、
2020-07-22 17:11:19
828
1
原创 CSS入门必备基础（适合小白）
CSS入门必备基础（适合小白）一、CSS是什么？1、什么是CSS？2、CSS有什么作用？二、CSS核心基础1、CSS样式规则2、引入CSS的方法1)、行内式2)、内嵌式3)、链入式2、CSS选择器1)、基础选择器2)、后代选择器3)、并集选择器4)、交集选择器5)、通配符选择器三、文本的样式属性1、字体样式属性1)、font-size：字号大小2)、font-weight: 字体粗细3)、font-family:字体4)、font-style:字体风格5)、font:2、文本样式属性1)、line-heig
2020-07-19 18:07:42
2428
5
原创 JS入门必备基础知识（适合小白）
JS入门必备基础知识（适合小白）一、JS是什么？1、JS简介2、JS的组成部分3、JS的基本特点4、JS的特性5、JS与HTML、CSS的对比二、JS的用法1、JS的引入方法1）head中的 JavaScript 函数2）body中的 JavaScript 函数3）外部的 JavaScript2、JS的基本语法3、JS中的变量1）变量名2）变量值3）全局变量与局部变量4、数据类型1）基本数据类型2）引用数据类型3） JS的数据类型转换4）typeof 操作符5、JS代码在执行时分两个阶段1）预编译2）代码执
2020-07-17 19:45:23
13733
11
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人