wzndkj - 博客园

2019年3月16日

摘要： css动画的方式，比较局限，涉及到一些js动画的时候没法处理了。react-transition-group是react的第三方模块，借住这个模块可以更方便的实现更加复杂的动画效果 https://github.com/reactjs/react-transition-group https://r 阅读全文

posted @ 2019-03-16 20:57 wzndkj 阅读(1540) 评论(0) 推荐(0) 编辑

react中使用css动画效果

摘要： index.js import React, { Component, Fragment } from 'react'; class App extends Component { constructor(props){ super(props); this.state = { show: true 阅读全文

posted @ 2019-03-16 20:12 wzndkj 阅读(2017) 评论(0) 推荐(0) 编辑

2019年3月15日

react中性能优化的点

摘要： react提升代码性能的点 1、绑定如果改变作用域点话放在constructor里面做，这样可以保证整个程序的作用域绑定操作只会执行一次，而且避免子组件的无谓渲染。 2、内置的setState是个异步操作，多次数据的改变变成一次，这样可以降低虚拟dom的比对频率 3、底层用虚拟dom，同层比对，ke 阅读全文

posted @ 2019-03-15 06:42 wzndkj 阅读(215) 评论(0) 推荐(0) 编辑

2019年3月14日

react生命周期函数

摘要：首先什么叫做生命周期函数，生命周期函数指的是在某一个时刻组件会自动调用执行的函数。比如之前的render函数，当state和props发生改变的时候，render函数会被重新执行，那么他是自动的被组件调用执行的。所以render函数实际上就是一个生命周期函数。再看constructor()算不算一阅读全文

posted @ 2019-03-14 07:06 wzndkj 阅读(397) 评论(0) 推荐(0) 编辑

2019年3月13日

react中虚拟dom的diff算法

摘要： 1、state 数据 2、jsx模板 3、生成虚拟dom（虚拟DOM就是一个js对象，用它来描述真实DOM） ['div', {id:'abc'}, ['span', {}, 'hello world']] 通过这样的一个js对象，我们就可以表述上面的dom结构了 4、用虚拟dom的结构，生成真实的阅读全文

posted @ 2019-03-13 06:43 wzndkj 阅读(1429) 评论(0) 推荐(0) 编辑

2019年3月11日

React中的虚拟DOM

摘要：当组件当state和props发生变化当时候，组件当render函数就会重新执行，组件就会被重新渲染，react中实现这种重新渲染，他的性能是非常高的，因为他引入了一个虚拟Dom的概念，那么什么是虚拟的Dom，为什么虚拟Dom带来了变革性当改变当state发生变化,render函数会重新执行，重新阅读全文

posted @ 2019-03-11 22:00 wzndkj 阅读(384) 评论(0) 推荐(0) 编辑

react中 props,state与render函数的关系

摘要：我们很明显的能够感受到，react是一门数据驱动的框架，当数据发生变化，页面就会自动发生变化，他背后的原理是怎么样子的呢比如todolist例子里面，inputValue变了，框里面的内容就会自动变。同时input框里面见监听了onChange事件，input框里面的内容变了,inputValue 阅读全文

posted @ 2019-03-11 06:58 wzndkj 阅读(718) 评论(0) 推荐(0) 编辑

react中PropTypes与DefaultProps的应用

摘要：每个组件都有自己的props参数，这参数是从父组件接收的一些属性，那么如何对参数的类型作校验。如何定义参数的默认值。这里涉及到两个基础的概念，叫做proptypes 和 defaultprops。子组件要接收的类型是固定，父组件不能乱传。比如显示的是个字符串，父组件就不能传个函数过来，不然代码是有问阅读全文

posted @ 2019-03-11 06:44 wzndkj 阅读(846) 评论(0) 推荐(0) 编辑

2019年3月10日

围绕react衍生出来的思考

摘要：优势一、声明式开发首先react是声明式的开发方式，这个与之对应的是命令式开发方式，之前在用jquery写代码的时候，都是直接来操作dom，直接操作dom的这种编程方式，我们把他叫做命令式的编程，也就是我要创建一个页面，我要一点点的告诉dom,你要怎么去挂在，你要怎么去做，这种编程方式我们叫做命令阅读全文

posted @ 2019-03-10 21:15 wzndkj 阅读(260) 评论(0) 推荐(0) 编辑

2019年3月9日

React中的响应式设计思想和事件绑定

摘要：这两个点是react入门非常重要的两个点，以前我们是直接操作dom的形式去做，react的设计思想和以前直接操作dom是完全不同的，react是一个响应式的框架，他在做编程的时候，强调的是我们不要直接操作dom。我们操作的是数据，通过数据的变化，react会自动感知到数据的变化，自动的帮你去生成do 阅读全文

posted @ 2019-03-09 20:06 wzndkj 阅读(2575) 评论(0) 推荐(0) 编辑

Zina

不积跬步，无以至千里