import {createStore} from 'redux'
import { Counter, MakeMoney, SpendMoney } from './redux/Redux2/Counter'
import App from './redux/Redux2/App'
const store = createStore(Counter);
function render1() {
  ReactDOM.render(
      <App store={store} MakeMoney={MakeMoney} SpendMoney={SpendMoney}/>,
      document.getElementById('root')
  )
}
render1();
//重新渲染render，store去订阅render
store.subscribe(render1)

import React, {Component} from 'react'
import {Button} from 'antd-mobile';
import 'antd-mobile/dist/antd-mobile.css'

export default class App extends React.Component {
  render() {
    //属性获取可以直接用
    const store = this.props.store;
    //获取当前状态
    const money = store.getState();
    //获取方法
    const MakeMoney = this.props.MakeMoney;
    const SpendMoney = this.props.SpendMoney;
    return (
        <div>
          <h1 align='center'>现在手里有{money}块钱</h1>
          <Button type='primary' onClick={() => store.dispatch(MakeMoney())}>赚钱</Button>
          <br/>
          <Button type='primary' onClick={() => store.dispatch(SpendMoney())}>花钱</Button>
        </div>
    )
  }
}

const makeMoney = "赚了1块钱";
const spendMoney = "花了1块钱";
//状态管理
export function Counter(state = 0, action) {
  switch (action.type) {
    case makeMoney:
      return state + 1;
    case spendMoney:
      return state - 1;
    default:
      //初始状态
      return 10;
  }
}
//action creator 创建action
export function MakeMoney() {
  return {type:makeMoney}
}
export function SpendMoney() {
  return {type:spendMoney}
}