feat(add): redux-react-hook simple

redux-react-hook/example-simple/package.json

@@ -0,0 +1,14 @@
+{
+  "scripts": {
+    "start": "parcel src/index.html"
+  },
+  "devDependencies": {
+    "typescript": "^3.9.6"
+  },
+  "dependencies": {
+    "react": "^16.8.1",
+    "react-dom": "^16.13.1",
+    "redux": "^4.0.5",
+    "redux-react-hook": "^4.0.1"
+  }
+}

redux-react-hook/example-simple/src/app.tsx

@@ -0,0 +1,25 @@
+import * as React from 'react';
+import {useDispatch, useMappedState} from './store';
+
+export const App: React.FC = () => {
+  const appData = useMappedState((state) => ({
+    value: state.val,
+    times: state.count,
+  }));
+
+  const dispatch = useDispatch();
+
+  return (
+    <div>
+      <button onClick={() => dispatch({type: 'plus', payload: 2})}>
+        plus 2
+      </button>
+      <button onClick={() => dispatch({type: 'minus', payload: 1})}>
+        minus 1
+      </button>
+
+      <p>value is: {appData.value}</p>
+      <p>change times: {appData.times}</p>
+    </div>
+  );
+};

redux-react-hook/example-simple/src/index.html

@@ -0,0 +1,2 @@
+<div id="app"></div>
+<script src="index.tsx"></script>

redux-react-hook/example-simple/src/index.tsx

@@ -0,0 +1,11 @@
+import * as React from 'react';
+import ReactDOM from 'react-dom';
+import {StoreContext, myStore} from './store';
+import {App} from './app';
+
+ReactDOM.render(
+  <StoreContext.Provider value={myStore}>
+    <App />
+  </StoreContext.Provider>,
+  document.getElementById('app'),
+);

redux-react-hook/example-simple/src/store.ts

@@ -0,0 +1,28 @@
+import {create} from 'redux-react-hook';
+import {Reducer, createStore} from 'redux';
+
+type MyState = {val: number; count: number};
+
+type MyAction = {
+  type: string;
+  payload: number;
+};
+
+const myReducer: Reducer<MyState, MyAction> = (state, action) =>
+  state === undefined
+    ? {val: 0, count: 0}
+    : {
+        val:
+          action.type === 'plus'
+            ? state.val + action.payload
+            : state.val - action.payload,
+        count: state.count + 1,
+      };
+
+export const myStore = createStore(myReducer);
+
+export const {StoreContext, useDispatch, useMappedState} = create<
+  MyState,
+  MyAction,
+  typeof myStore
+>();