React项目中常用库

react-bootstrap

安装

npm install react-bootstrap --save
npm install [email protected] --save    //安装bootstrap指定3.3.7 版本

在index.js文件中增加css引用

import 'bootstrap/dist/css/bootstrap.min.css';
import 'bootstrap/dist/css/bootstrap-theme.css';

在需要用到bootstrap组件的代码中，引入所需组件

import { Navbar, Jumbotron, Button } from 'react-bootstrap';

npm start 重启生效

antd-init

服务于企业级产品的设计体系，基于确定和自然的设计价值观上的模块化解决方案，让设计者和开发者专注于更好的用户体验。

安装

npm install antd --save

引用

import 'antd/dist/antd.css';  // or 'antd/dist/antd.less'
import { LocaleProvider, DatePicker, message } from 'antd';
// 由于 antd 组件的默认文案是英文，所以需要修改为中文
import zhCN from 'antd/lib/locale-provider/zh_CN';

引入所需组件

render() {
    return (
      <LocaleProvider locale={zhCN}>
        <div style={{ width: 400, margin: '100px auto' }}>
          <DatePicker onChange={value => this.handleChange(value)} />
          <div style={{ marginTop: 20 }}>当前日期：{this.state.date && this.state.date.toString()}</div>
        </div>
      </LocaleProvider>
    );
  }

react-transition-group

安装

npm install react-transition-group --save

Redux

安装

npm install --save redux

createStore    // 创建store
store.dispatch   //派发action，传递给store
store.getState   //获取store里面的所有数据，
store.subscribe  //订阅store的改变，只要store发生改变，subscribe接受的这个函数就会执行