react
zcm629
这个作者很懒,什么都没留下…
展开
-
react生命周期函数
Todolist.js组件import React, { Component, Fragment } from 'react'import TodoItem from './TodoItem'import './style.css'export default class Todolist extends Component { // 当父组件的render函数被运行时候...原创 2018-12-17 14:17:25 · 115 阅读 · 0 评论 -
Redux的工作流
一、安装reduxnpm i redux二、在src下创建store文件夹index.js文件import { createStore } from 'redux'import reducer from './reducer'const store = createStore(reducer)export default store reducer.jsco...原创 2018-11-23 15:48:14 · 429 阅读 · 0 评论 -
react-redux
一、store文件下actionType.js文件,定义acition类型的常量export const CHANGE_INPUT_VALUE = 'change_input_value'export const ADD_ITEM = 'add_item'export const DEL_ITEM = 'del_item'2、reducer.js文件,根据不同的action类型,...原创 2019-02-15 14:02:20 · 125 阅读 · 1 评论 -
immutable在react中的使用
在使用redux时,组件派发出action,在reducer中处理时,我需要返回一个处理后的新的对象,也就是说不能对state进行直接的修改。immutable的作用就是,将state设置为不可变对象。以下是实现步骤。按照依赖npm install immutablestore文件夹下reducer.jsimport { fromJS } from 'immutable';...原创 2019-02-15 14:21:30 · 566 阅读 · 0 评论 -
redux-immutable统一数据格式
在实际项目中,数据都放在reducer.js下不利于对数据进行管理,可以把一个大的reducer.js拆分成多个小的reducer.js。一、header文件夹下的store文件夹reducer.jsconst defaultState={ focused:false}export default(state=defaultState,action)=>{ ...原创 2019-02-15 14:56:39 · 273 阅读 · 0 评论 -
React-使用Redux-thunk中间件实现ajax数据请求
把异步函数放在生命周期函数里写,生命周期函数会变得越来越复杂,组件会变得越来越大。Redux默认只处理同步,借助redux-thunk ,可以把异步请求放在actionCreators.js里管理,而且有利于自动化测试。中间件指的是是action 与store的中间,是redux的中间件,它使得我们可以在action中写函数(返回函数)安装依赖npm install redux-thun...原创 2019-02-15 17:24:34 · 389 阅读 · 0 评论 -
react动态路由、异步组件
一、动态路由列表组件<Link key={index} to={'/detail/' + item.get('id')}></Link> 路由配置<Route path='/detail/:id' exact component={Detail}></Route>详情组件获取 idthis.props.match.p...原创 2019-02-19 15:19:50 · 1207 阅读 · 0 评论