Skip to content

Commit 5a0753c

Browse files
introvert-yintrovert-y
committed
reducer中的拦截器为洋葱圈模式
1 parent dbe2c2f commit 5a0753c

File tree

12 files changed

+36
-226
lines changed

12 files changed

+36
-226
lines changed

‎public/index.html

Lines changed: 12 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,15 @@
11
<!DOCTYPE html>
22
<html lang="en">
3-
<head>
4-
<meta charset="utf-8" />
5-
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6-
<meta name="viewport" content="width=device-width, initial-scale=1" />
7-
<meta name="theme-color" content="#000000" />
8-
<meta
9-
name="description"
10-
content="Web site created using create-react-app"
11-
/>
12-
<link rel="apple-touch-icon" href="logo192.png" />
13-
<!--
14-
manifest.json provides metadata used when your web app is installed on a
15-
user's mobile device or desktop. See https://developers.google.com/web/fundamentals/web-app-manifest/
16-
-->
17-
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
18-
<!--
19-
Notice the use of %PUBLIC_URL% in the tags above.
20-
It will be replaced with the URL of the `public` folder during the build.
21-
Only files inside the `public` folder can be referenced from the HTML.
22-
23-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
24-
work correctly both with client-side routing and a non-root public URL.
25-
Learn how to configure a non-root public URL by running `npm run build`.
26-
-->
27-
<title>React App</title>
28-
</head>
29-
<body>
30-
<noscript>You need to enable JavaScript to run this app.</noscript>
31-
<div id="root"></div>
32-
<!--
33-
This HTML file is a template.
34-
If you open it directly in the browser, you will see an empty page.
35-
36-
You can add webfonts, meta tags, or analytics to this file.
37-
The build step will place the bundled scripts into the <body> tag.
38-
39-
To begin the development, run `npm start` or `yarn start`.
40-
To create a production bundle, use `npm run build` or `yarn build`.
41-
-->
42-
</body>
3+
<head>
4+
<meta charset="utf-8" />
5+
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico" />
6+
<meta name="viewport" content="width=device-width, initial-scale=1" />
7+
<meta name="theme-color" content="#000000" />
8+
<meta name="description" content="Web site created using create-react-app" />
9+
<title>react Demo</title>
10+
</head>
11+
<body>
12+
<noscript>You need to enable JavaScript to run this app.</noscript>
13+
<div id="root"></div>
14+
</body>
4315
</html>

‎public/logo192.png

-5.22 KB
Binary file not shown.

‎public/logo512.png

-9.44 KB
Binary file not shown.

‎public/manifest.json

Lines changed: 0 additions & 25 deletions
This file was deleted.

‎public/robots.txt

Lines changed: 0 additions & 3 deletions
This file was deleted.

‎src/index.js

Lines changed: 7 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -10,30 +10,24 @@ import { Provider } from "react-redux";
1010
import reducer from "./page/reducer/index";
1111
import AppRouter from "./router/index";
1212
import thunkMiddleware from "./thunkMiddleware";
13-
import * as serviceWorker from "./serviceWorker";
1413

1514
/**
1615
* 官方自带的操作显示工具
1716
*/
1817
const loggerMiddleware = createLogger();
1918

20-
// const logger = store => next => action => {
21-
// console.log("dispatching", action);
22-
// const result = next(action);
23-
// console.log("next state", store.getState());
24-
// return result;
25-
// };
19+
const logger = store => next => action => {
20+
console.log("dispatching", action);
21+
const result = next(action);
22+
console.log("next state", store.getState());
23+
return result;
24+
};
2625

27-
const store = createStore(reducer, applyMiddleware(thunkMiddleware, loggerMiddleware));
26+
const store = createStore(reducer, applyMiddleware(thunkMiddleware, logger));
2827

2928
ReactDOM.render(
3029
<Provider store={store}>
3130
<AppRouter />
3231
</Provider>,
3332
document.getElementById("root")
3433
);
35-
36-
// If you want your app to work offline and load faster, you can change
37-
// unregister() to register() below. Note this comes with some pitfalls.
38-
// Learn more about service workers: https://bit.ly/CRA-PWA
39-
serviceWorker.unregister();

‎src/logo.svg

Lines changed: 0 additions & 7 deletions
This file was deleted.

‎src/page/Counter/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,11 @@ const mapStateToProps = state => ({
99
const mapDispatchToProps = {
1010
onIncreaseClick: () => ({
1111
type: "increase",
12-
count: 10,
12+
count: 1,
1313
}),
1414
onDecreaseClick: () => ({
1515
type: "decrease",
16-
count: 10,
16+
count: 1,
1717
}),
1818
changeName: () => ({
1919
type: "changeName",

‎src/page/CssTest/index.js

Lines changed: 7 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,19 @@ const StyledDiv = styled.div`
88
text-align: center;
99
.blue_color {
1010
color: red;
11+
.name {
12+
color: blue;
13+
}
1114
}
1215
`;
1316

1417
function Page() {
1518
return (
1619
<StyledDiv>
17-
<h1 className="blue_color">styled-components的样式</h1>
18-
<h2 className={style.pink_color}>App.module.css里定义的样式</h2>
20+
<h2 className="blue_color">
21+
<span className="name">styled-components</span>的样式，支持嵌套写法，即子类样式可以放在父类的样式里
22+
</h2>
23+
<h2 className={style.pink_color}>外部链接表，可查看类名，webpack自动帮转义类名</h2>
1924
<h3 className="title">App.module.css里定义的全局样式</h3>
2025
</StyledDiv>
2126
);

‎src/page/hookTest/index.js

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -25,12 +25,12 @@ function useWinSize() {
2525

2626
function Example() {
2727
const size = useWinSize();
28-
2928
return (
30-
<div>
31-
自定义hook作为公共的逻辑处理，相当于一个函数，返回一个值或对象。 Page size: {size.width} * {size.height}
32-
</div>
29+
<>
30+
<div>
31+
自定义hook作为公共的逻辑处理，相当于一个函数，返回一个值或对象。 Page size: {size.width} * {size.height}
32+
</div>
33+
</>
3334
);
3435
}
35-
3636
export default Example;

0 commit comments

Comments
 (0)