React
andyzau007
这个作者很懒,什么都没留下…
展开
-
React基础(一)
React创建组件的两种方式 1 通过 JS函数 创建(无状态组件) 2 通过 class 创建(有状态组件)函数式组件 和 class 组件的使用场景说明:1 如果一个组件仅仅是为了展示数据,那么此时就可以使用 函数组件2 如果一个组件中有一定业务逻辑,需要操作数据,那么就需要使用 class 创建组件,因为,此时需要使用 state原创 2018-09-25 16:32:28 · 238 阅读 · 0 评论 -
Redux原理及工作流程和使用方法(四)
一、Redux结构图各部分的身份把这个过程比拟成图书馆的一个流程来帮助理解。React Component(借书的人 )需要借书的人Action Creator(具体借书的表达)想借书的人向图书馆管理员说明要借的书的那句话。Store(图书馆管理员)负责整个图书馆的管理。是Redux的核心Reducers(图书馆管理员的记录本)管理员需要借助Reducer(图书馆管理员的记...原创 2018-10-01 23:43:11 · 3342 阅读 · 0 评论 -
UI组件与容器组件的拆分以及无状态组件优化(五)
UI组件:只负责页面的渲染功能,也称为傻瓜组件;容器组件:负责组件的业务逻辑,也称为聪明组件;组件如何渲染由render函数决定,当逻辑和渲染都写在一个组件中,给维护带来很大的困难,这是可以将组件进行拆分,让UI组件单独负责页面渲染的功能(只包含render函数),让容器组件负责逻辑,在容器组件中引入UI组件进行渲染即可,这样可以使代码更加精简...原创 2018-10-02 09:55:35 · 712 阅读 · 0 评论 -
Redux中发送异步请求及Redux中的React-thunk中间件使用(六)
ajax请求相关代码TodoList.jsimport React ,{Component}from 'react';import store from './store/index';import { getInputChangeAction,getddItemActiom,getDeleteItemAction, initListAction }from './store/action...原创 2018-10-02 17:33:25 · 3206 阅读 · 1 评论 -
一张图了解React组件的生命周期(二)
组件生命周期函数的定义:从组件被创建,到组件挂载到页面上运行,再到页面关闭组件被卸载,这三个阶段总是伴随着组件各种各样的事件,那么这些事件,统称为组件的生命周期函数!组件生命周期函数总览组件的生命周期包含三个阶段:创建阶段(Mounting)、运行和交互阶段(Updating)、卸载阶段(Unmounting)(1)创建阶段-Mounting:特点:该阶段的函数只执行一次。constr...原创 2018-09-27 09:11:16 · 248 阅读 · 0 评论 -
使用React-Redux简单项目入门(七)
目录结构:相关代码1:index.jsimport React from 'react';import ReactDOM from 'react-dom';import TodoList from './TodoList';//第一步import {Provider} from 'react-redux';//引入react-redux import store from '...转载 2018-10-04 17:34:40 · 220 阅读 · 0 评论 -
React-Transition-group之 React 动画组件(三)
React-Transition-group之 React 动画组件组件安装------CSSTransition部分项目目录下使用命令行npm install react-transition-group@1.x --save安装组件。在需要使用动画的页面加入以下代码import { CSSTransition, TransitionGroup } from "react-trans...原创 2018-09-29 09:20:52 · 491 阅读 · 0 评论