blog icon indicating copy to clipboard operation
blog copied to clipboard

在react中使用Hooks组件并使用redux管理状态

Open wuxianqiang opened this issue 5 years ago • 0 comments

import React, { useEffect, useState } from 'react';
import './App.css';
import store from './store'
import action from './store/action'
import { bindActionCreators } from 'redux'
let toAction = bindActionCreators(action, store.dispatch)

function App() {
  let [count, setCount] = useState(store.getState().number);
  useEffect(() => {
    let unsubscribe = store.subscribe(() => {
      setCount(store.getState().number)
    })
    return unsubscribe
  }, [])
  let handleClick = () => {
    toAction.increment(count + 1)
  }
  let handleFive = () => {
    toAction.increment(count + 5)
  }
  return (
    <div className="App">
      <div>{count}</div>
      <button onClick={handleClick}>+1</button>
      <button onClick={handleFive}>+5</button>
    </div>
  );
}

export default App;

wuxianqiang avatar Jan 08 '20 03:01 wuxianqiang