React_创建redux中的store_ZHOU125disorder_

创建redux中的store

1. 安装Redux

安装我就不写在这;
百度一下你就知道;
百度上面有很多;

2. 创建store

1. 在src目录下创建一个名字叫store的文件夹
2. 在store文件夹下创建一个名字叫index.js的文件
3. 在store文件夹下创建一个名字叫reducer.js的文件
4. 开始写代码

store文件夹下的index.js&&reducer文件

index.js

import { ceateStore, createStore } from 'redux';
import reducer from './reducer';

const store = createStore(reducer);

export default store;

reducer

const defaultState = {
  inputvalue: '卡卡西',
  list:[996,717]
};

export default (state=defaultState, action) => {
  return state;
}

src下的index.js文件

import { Button, Input, List } from 'antd';
import 'antd/dist/antd.css';
import React, { Component, Fragment } from 'react';
//引入store
import store from './store/index.js';


class TodoList extends Component{
  constructor(props) {
    super(props);
    this.state = store.getState();
    console.log(this.state);
  }
  render() {
    return (
      <Fragment>
        <Input style={{ width: "300px" }} value={this.state.inputvalue}/>
        <Button type="primary">Primary Button</Button>
        <List
          style={{width:"456px"}}
          bordered
          dataSource={this.state.list}
          renderItem={item => (
        <List.Item>
          {item}
        </List.Item>
      )}
    />
      </Fragment>
    )
  }
}

export default TodoList;