# react模板

**Repository Path**: rubyhu/react_template

## Basic Information

- **Project Name**: react模板
- **Description**: 一个已经建好了store router 的基础模板
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 1
- **Created**: 2025-11-27
- **Last Updated**: 2025-11-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

##搭建一个react项目
react
  ##(js中可以使用jsx语法)
react-dom
  ##reactDOM.render(<App/>,document.getElementById('root'))
styled-components
  ##和sass、less相似但是又有区别
  ##用于创建导出组件中的标签，使各个组件之间的样式能够相互独立，互不影响
  ##export const HomeWarpper = styled.div`width:10px;height:10px;display:table`
  ##创建全局样式{createGlobalStyle}
  ##创建关键帧动画 {keyframes} const fade = keyframes`from{opacity:0};to{opacity:1}`
  ##################################################`animation: ${fade} .2s ease-out`
redux
  ##用来创建一个可以在组件中使用的store
  ##reducer里存放着(store=defultStore, action)=>{}用于触发store中数据的更新
  ##actionCrators中存放着一些方法、action、axios异步请求
  ##actionTypes中存放着一些常量用于对应action中的type,便于debug
  ##index.js导出{actionCrators,reducer}
redux-thunk
  ##这个插件使dispatch中可以是一个function,可以使用异步代码发送请求
react-redux
  ##Provider(在根组件中使用这个组件，让所有子组件都有获取store的权限)
  ##connect(在子组件中结合mapStateToProps和mapDispatchToProps使用)让一个UI组件变成一个容器组件
immutable
  ##用于创建一个不可改变的对象，结合redux使用优化store(更快，算法节约内存)
  ##常用api(fromJS,get,getIn,set,merge,toJS(),map)
react-router-dom
  ##用于路由控制{BrowserRouter as Router, route} from 'react-router-dom'
  ##exact精确路由相当于一个正则判断
  ##{Link} 用于在组件里进行路由切换和to="/detail"结合使用
  
一个react的基本配置就完成了

1.组件化样式隔离
##styled-components
2.数据管理存储
##redux
##redux-thunk(用于异步请求)
##react-redux(优化redux在react中的使用便利程度)
3.immutable
##和redux结合使用优化数据结构，提高程序响应速度
4.路由控制
##react-router-dom