Alison_Z的博客

react hooks的依赖项目可以按照数据类型分为基本数据类型和引用数据类型，当为基本数据类型时useEffect可以根据依赖项的变化而去发生改变，当为引用数据类型时，useeffect总是会被触发，因为useEffect这里进行的时浅比较eg:当依赖项为基本数据类型时const [count, setCount] = useState[0];useEffect(() => {console.log(count)}, [count]);这里当count发生变化时会在usee

最近在用react做一个项目中的一个模块，总结react的几个重要的点1.state用于保存变量，setstate用于更新变量的值，但是要注意变量的冗余度，如果是一组数据同时变化需要修改的话可以在state中放置一个类似于modal的变量集2.使用最频繁的几个生命周期componentDidMount中可以渲染你想要一打开页面就看到的图表之类的东西componentWillMount和Compon...

需求：如下图所示，在年级复选框的前提下区分成全部，上架，下架三个选项首先我们在之前下拉框后增加一个下拉框，如果值比较少，可以手动写好在onselect中实现对应的事件方法取到我们选择的值，接下来我们需要在state中存放一个变量用来保存onselect变化时选择的value值，以便在我们需要的地方去使用这样就可以实现多个下拉框筛选功能了...

该问题的原因是config.js文件中最后没有添加export default config；没有导出config文件导致出错。

此处问题：return<div>...</div>//写法错误，这样的话相当于return后面没有返回的东西有以下两种写法：一：return <div>..</div>//不可换行二：return (<div>...</div>//可以换行)...

props一般是组件间传值state用于更新一个视图中的值等值的更新要通过触发setstate来传递到update生命周期，因此要先定义state的初识状态，在setstate中进行修改map中若是写了{}必须要有return才行在render中若是值的话写在{ }中（js）...

react优势1.组件化，而不是写一大堆html模版js逻辑和html标签紧密连接并且及易理解2.单项数据流数据一旦更新，就直接渲染整个app以往的方式：管理UI的状态并不简单修改dom树 修改数据 接受用户的输入 异步API的数据请求与传统的服务器端渲染相似传统方式1.浏览器请求页面 2.服务器请求数据库 3.将数据传给模版 4.模版渲染页面react的渲染方式1.用户输入 2.从API获取数据...

在Javascript中，Function是一种对象。Function对象中的this指向决定于函数被调用的方式。使用apply，call 与 bind 均可以改变函数对象中this的指向，在说区别之前还是先总结一下三者的相似之处：1、都是用来改变函数的this对象的指向的。2、第一个参数都是this要指向的对象。3、都可以利用后续参数传参。call方法: 语法：call([thisOb...

将元素固定在页面右下角

前端基本知识（四）：JS的异步模式：1、回调函数；2、事件监听；3、观察者模式；4、promise对象 JavaScript语言将任务的执行模式可以分成两种：同步（Synchronous）和异步（Asychronous）。“同步模式”就是一个任务完成之后，后边跟着一个任务接着执行；程序的执行顺序和排列顺序是一直的；”异步模式”则完全不同，每一个任务都有一个或者多个回调函数（callback），前一...

说说你对HTML语义化的理解?(1)什么是 HTML 语义化？<基本上都是围绕着几个主要的标签，像标题（ H1~H6 ）、列表（ li ）、强调（ strong em ）等等 >根据内容的结构化（内容语义化），选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。(2)为什么要语义化？为了在没有CSS的情况下，页面也能呈现出很好地内容结构、代...

sessionStorage 和 localStorage 是 HTML5 Web Storage API 提供的，可以方便的在 web 请求之间保存数据。有了本地数据，就可以避免数据在浏览器和服务器间不必要地来回传递。sessionStorage、 localStorage 、 cookie 都是在浏览器端存储的数据，其中 sessionStorage 的概念很特别，引入了一个“浏览器窗口”的概...

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。它允许浏览器向跨源服务器，发出XMLHttpRequest请求，从而克服了AJAX只能同源使用的限制。本文详细介绍CORS的内部机制。一、简介CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。整个CORS通信过程，都是浏览器自动完成，不需要用户...

为什么使用组件一开始用react做项目的时候只知道react是组件化的，但是没有深入去理解为什么要封装组件，怎样去封装组件上周在实际项目中自己尝试去封装了一个组件，最大的感受就是代码变得简洁了很多，本来要写三次类似代码现在只写一次就搞定了，不得不感概组件封装最实在的意义。另一方面是可以提高我们编程的效率，代码复用性高了自然效率高了。最后我觉得是提高思考的能力吧，换种更简单的方式去实...

看报错的原因：最后一句，你可能有react的多个版本存在。然后点击下面的details可以看到文章最后建议我们可以npm ls react来看一下，于是有了我的第二张图对于第二张图我们猜测可能时react的版本有问题，于是先对npm进行更新得以解决。...

React推出后，出于不同的原因先后出现三种定义react组件的方式，殊途同归；具体的三种方式：函数式定义的无状态组件 es5原生方式React.createClass定义的组件 es6形式的extends React.Component定义的组件虽然有三种方式可以定义react的组件，那么这三种定义组件方式有什么不同呢？或者说为什么会出现对应的定义方式呢？下面就简单介绍一下。无状态...

第一种方式使用link：<Link to={{ pathname: 'purchaseRecord', type: 'inputs', id: '1'}} ><a onClick={()=>this.handleRecord()}>拼团记录</a></Link>获取传过来的值：this.props.location.type/id第...

第一种方式：安装依赖react-scripts第二种方式：使用webpack-dev-server来配置启动WEB服务器。 来自链接webpack-dev-server

本文介绍了react、redux、react-redux之间的关系，分享给大家，也给自己留个笔记，具体如下：React一些小型项目，只使用 React 完全够用了，数据管理使用props、state即可，那什么时候需要引入Redux呢？ 当渲染一个组件的数据是通过props从父组件中获取时，通常情况下是 A --> B，但随着业务复杂度的增加，有可能是这样的：A --> B --&gt...

如图要想实现这个效果，首先这些图片是存储在一个数组中的，我们要取出图片然后遍历显示出来，可以如下显示： render: (text) => { if (text && text.length) { const imgs = text.map((item, index) => <div ...

设置样式之前要先设置display和width，因为span是行内元素本身是没有宽度的宽度默认是auto，所以如果不事先设置这两个属性直接设置whiteSpace是不起作用的。...

最近在写项目中发现如果想要对一个数组进行操作经常会用到遍历的方式，在用到遍历的方式的时候经常用到的有map和forEach方法，下面结合我查阅的资料和自己项目中的体会谈谈二者的区别。首先map方法：map对一个数组对象进行操作时，一般是生成一个新的数组，可以在map中限制生成新数组的条件，有返回值forEach方法：forEach方法一般是对原有的数组进行操作，没有返回值示例下方提供了一个数组，如...

获取默认时间的二种方式第一种首先是获取当前时间可以是这样的注意到这里设置的defaultValue就是显示的默认时间如果想要获取一段时间比如说7天以前的我们可以这样const startTime = moment().add(-7,'days').format('YYYY-MM-DD');然后将moment的第一个参数改成startTime即可第二种这种情况可能是你把dataPicker放到了fo...

最近在实现一个功能时一开始想的比较简单，后来因为需要更加完善的功能一时无从下手最终是带我的学长实现的，看了他写的代码学到不少，下面记录一下自己的心得体会。如图要实现的是左边模糊查询以后右边显示出查询的结果，然后点击相应的结果以后下方显示出对应的记录。首先对于上面的查询显示就是一个简单的模糊查询主要依靠后台的结果，然后将查询的结果放在select的option里面即可对于下方的展示功能（注意还有右方...

最近在写项目中为了清空modal中的值，所以用到了resetFields方法，该方法主要是对form中的值进行重置，没有默认值的情况下会被清空但是需要注意的是若是有需要部分的值一直存在的话，要注意在清空之前进行一个保存，在清空之后在用setFieldsValue进行设置如图注意resetFields的位置...

Http协议三次握手过程  2013-05-23 17:00:28|  分类： http头|字号 订阅TCP(Transmission Control Protocol)　传输控制协议TCP是主机对主机层的传输控制协议，提供可靠的连接服务，采用三次握手确认建立一个连接:位码即tcp标志位,有6种标示:SYN(synchronous建立联机) ACK(acknowledgement 确认) PSH(...

2开头 （请求成功）表示成功处理了请求的状态代码。200   （成功）  服务器已成功处理了请求。 通常，这表示服务器提供了请求的网页。 201   （已创建）  请求成功并且服务器创建了新的资源。 202   （已接受）  服务器已接受请求，但尚未处理。 203   （非授权信息）  服务器已成功处理了请求，但返回的信息可能来自另一来源。 204   （无内容）  服务器成功处理了请求，但没有返...

ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页。接下来通过本文给大家介绍Ajax的使用四大步骤，非常不错，感兴趣的朋友看下吧什么是ajax?ajax(异步javascript xml) 能够刷新局部网页数据而不是重新加载整个网页。如何使用ajax?第一步，创建xmlhttprequest对象，var xmlhttp =new XMLHttpRequest（...

js中的this指向十分重要，了解js中this指向是每一个学习js的人必学的知识点，今天没事，正好总结了js中this的常见用法，喜欢的可以看看：全局作用域或者普通函数中this指向全局对象window。//直接打印console.log(this) //window//function声明函数function bar () {console.log(this)}bar() //win...

在es6下改var 为 let 或者 const 。 var可以完全替换成 let 。 需要注意的是 let 与 const 区别并不大，let 是变量，const 是常量。只要定义的不会改变就用 constES6新增let和const两个变量声明命令，他们都具有如下特性：1、块局作用域；2、不存在变量提升，一定声明后才能使用；3、暂时性死区，在代码块内使用let命令声明变量之前，该变量都是不可用...

通过var定义的变量，作用域是整个封闭函数，是全域的 。通过let定义的变量，作用域是在块级或是子块中。for (let i = 0; i < 10; i++) { // ...}console.log(i);// ReferenceError: i is not defined//计数器i只在for循环体内有效，在循环体外引用就会报错。1234567变量提升现象：浏览器在运行...

阮一峰的网络日志 » 首页 » 档案上一篇：Web service下一篇：纪录片《Code Ru分类： JavaScript学习Javascript闭包（Closure）作者： 阮一峰日期： 2009年8月30日闭包（closure）是Javascript语言的一个难点，也是它的特色，很多高级应用都要依靠闭包实现。下面就是我的学习笔记，对于Javascript初学者应该是很有用的。一、变量的作用域...

刚开始用vue或者react，很多时候我们都会把ES6这个大兄弟加入我们的技术栈中。但是ES6那么多那么多特性，我们需要全部都掌握吗？秉着二八原则，掌握好常用的，有用的这个可以让我们快速起飞。接下来我们就聊聊ES6那些可爱的新特性吧。1.变量声明const和let我们都是知道在ES6以前，var关键字声明变量。无论声明在何处，都会被视为声明在函数的最顶部(不在函数内即在全局作用域的最顶部)。这就是...

相信凡是写过javascript的童鞋也一定都写过回调方法（callback），简单说回调方法就是将一个方法func2作为参数传入另一个方法func1中，当func1执行到某一步或者满足某种条件的时候才执行传入的参数func2，例如下面的代码段// 当参数a大于10且参数func2是一个方法时 执行func2function func1(a, func2) { if (a > 10...

过渡过渡三要素：1.必须要有属性发生变化 如：width background等2.必须要告诉系统哪个属性需要执行过渡效果：transition-property:width,background;3.必须告诉系统过渡效果的持续时长：transition-duration:5s,5s;transition-delay//告诉系统延迟多少秒才执行过渡效果transition-timing-funct...

.apply()用法和call()的区别Js apply方法详解我在一开始看到javascript的函数apply和call时,非常的模糊,看也看不懂,最近在网上看到一些文章对apply方法和call的一些示例,总算是看的有点眉目了,在这里我做如下笔记,希望和大家分享.. 如有什么不对的或者说法不明确的地方希望读者多多提一些意见,以便共同提高..主要我是要解决一下几个问题:1.apply和call...

JS实现数组去重方法总结(六种方法)方法一：双层循环，外层循环元素，内层循环时比较值如果有相同的值则跳过，不相同则push进数组?123456789101112131415161718Array.prototype.distinct = function(){ var arr = this,  result = [],  i,  j,  len = arr.length; for(i = 0; i...

Web浏览器中可能发生的事件有很多类型。这里我将主要将下面几种常用的事件类型：UI事件焦点事件鼠标与滚轮事件键盘与文本事件复合事件变动事件HTML5事件设备事件触摸与手势事件　　第一部分：UI事件　　UI事件中UI即(User Interface,用户界面)，当用户与页面桑拿的元素交互时触发。　　UI事件中主要包括load,unload,abort,error,select,resize,scro...