Redux的用法详解+antd

1. 安装antd npm install antd --save
2. 在 src/index.js 中引入 import 'antd/dist/antd.css'
3. 安装redux npm install --save redux
4. 安装Redux Devtool chrome插件

创建一个文件夹 store
store/index.js

import reducer from './reducer'
//调试工具Redux Devtools配置
const composeEnhancers =  window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
//createStore生成store 接受另外一个函数 返回一个新的store对象
const store = createStore(reducer,composeEnhancers );
export default store

store/reduce.js

todolist.js
在组件中引入import store from '../store/index'
获取store中的内容`store.getState()
如果要改变store中的state的状态

import React, {
    Component, Fragment } from 'react';
import store from '../store/index'
import TodolistUi from './todolistUI'
import {
    changeAction  ,clickBtnAction,DelAction ,getList } from '../store/action'
import Axios from 'axios';

class Todolist extends Component {
   
    constructor(props){
   
        super(props)
        this.state={
   
            store:store.getState()
        }
        // this.storechage = this.storechage.bind(this);
        store.subscribe(()=>this.storechage())  //订阅一下
        
    }
    //从axios取数据
    componentDidMount(){
   
        Axios.get('json/list.json').then((res)=>{
   
            const data = res.data.data.list
            console.log('ccc'+data)
            store.dispatch( getList(data) )   //出入store
        })
    }




    render() {
    
        return ( 
        <Fragment>