Skip to content

Commit 4ea1626

Browse files
author
zhangyue0503
committed
20170710
1 parent 7d9e522 commit 4ea1626

File tree

13 files changed

+563
-222
lines changed

13 files changed

+563
-222
lines changed

.idea/workspace.xml

+305-222
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"presets": ["es2015", "react"],
3+
"env": {
4+
"development": {
5+
"presets": ["react-hmre"]
6+
}
7+
}
8+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
import React,{Component,PropTypes} from 'react';
2+
3+
class Counter extends Component{
4+
constructor(props){
5+
super(props);
6+
this.incrementAsync = this.incrementAsync.bind(this);
7+
this.incrementIfOdd = this.incrementIfOdd.bind(this);
8+
}
9+
10+
incrementIfOdd(){
11+
if(this.props.value %2 !== 0){
12+
this.props.onIncrement();
13+
}
14+
}
15+
16+
incrementAsync(){
17+
setTimeout(this.props.onIncrement,1000);
18+
}
19+
20+
render(){
21+
const {value,onIncrement,onDecrement} = this.props;
22+
return {
23+
<p>
24+
Clicked:{value} times
25+
{' '}
26+
<button onCLick={onIncrement}>+</button>
27+
{' '}
28+
<button onCLick={onDecrement}>-</button>
29+
{' '}
30+
<button onCLick={this.incrementIfOdd}>Increment if odd</button>
31+
{' '}
32+
<button onCLick={this.incrementAsync}>Increment async</button>
33+
</p>
34+
};
35+
}
36+
}
37+
38+
39+
Counter.propTypes = {
40+
value:PropTypes.number.isRequired,
41+
onIncrement:PropTypes.func.isRequired,
42+
onDecrement:PropTypes.func.isRequired
43+
};
44+
45+
export default Counter;
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Example</title>
5+
</head>
6+
<body>
7+
<div id="root">
8+
</div>
9+
<script src="/static/bundle.js"></script>
10+
</body>
11+
</html>
+22
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom';
3+
import { createStore } from 'redux';
4+
import Counter from './components/Counter';
5+
import counter from './reducers';
6+
7+
const store = createStore(counter);
8+
const rootEl = document.getElementById('root');
9+
10+
function render() {
11+
ReactDOM.render(
12+
<Counter
13+
value={store.getState()}
14+
onIncrement={() => store.dispatch({ type: 'INCREMENT' })}
15+
onDecrement={() => store.dispatch({ type: 'DECREMENT' })}
16+
/>,
17+
rootEl
18+
);
19+
}
20+
21+
render();
22+
store.subscribe(render);
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
{
2+
"name": "10-counter",
3+
"version": "0.0.0",
4+
"description": "React Redux example",
5+
"scripts": {
6+
"start": "node server.js"
7+
},
8+
"dependencies": {
9+
"react": "^15.3.1",
10+
"react-dom": "^15.3.1",
11+
"redux": "^3.2.1"
12+
},
13+
"devDependencies": {
14+
"babel-core": "^6.3.15",
15+
"babel-loader": "^6.2.0",
16+
"babel-preset-es2015": "^6.3.13",
17+
"babel-preset-react": "^6.3.13",
18+
"babel-preset-react-hmre": "^1.1.1",
19+
"babel-register": "^6.3.13",
20+
"express": "^4.13.3",
21+
"webpack": "^1.9.11",
22+
"webpack-dev-middleware": "^1.2.0",
23+
"webpack-hot-middleware": "^2.9.1"
24+
},
25+
"repository": {
26+
"type": "git",
27+
"url": "git+https://github.com/lewis617/react-redux-book.git"
28+
},
29+
"license": "MIT",
30+
"bugs": {
31+
"url": "https://github.com/lewis617/react-redux-book/issues"
32+
},
33+
"homepage": "https://github.com/lewis617/react-redux-book#readme"
34+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export default function counter(state = 0,action){
2+
switch(action.type){
3+
case 'INCREMENT':
4+
return state+1;
5+
case 'DECREMENT':
6+
return state-1;
7+
default: return state;
8+
}
9+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/* eslint-disable */
2+
var webpack = require('webpack');
3+
var webpackDevMiddleware = require('webpack-dev-middleware');
4+
var webpackHotMiddleware = require('webpack-hot-middleware');
5+
var config = require('./webpack.config');
6+
7+
var app = new (require('express'))();
8+
var port = 3000;
9+
10+
var compiler = webpack(config);
11+
app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }));
12+
app.use(webpackHotMiddleware(compiler));
13+
14+
app.get("/", function(req, res) {
15+
res.sendFile(__dirname + '/index.html')
16+
});
17+
18+
app.listen(port, function(error) {
19+
if (error) {
20+
console.error(error)
21+
} else {
22+
console.info("==> 🌎 Listening on port %s. Open up http://localhost:%s/ in your browser.", port, port)
23+
}
24+
});
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
var path = require('path');
2+
var webpack = require('webpack');
3+
4+
module.exports = {
5+
devtool: 'cheap-module-eval-source-map',
6+
entry: [
7+
'webpack-hot-middleware/client',
8+
'./index.js'
9+
],
10+
output: {
11+
path: path.join(__dirname, 'dist'),
12+
filename: 'bundle.js',
13+
publicPath: '/static/'
14+
},
15+
plugins: [
16+
new webpack.optimize.OccurrenceOrderPlugin(),
17+
new webpack.HotModuleReplacementPlugin()
18+
],
19+
module: {
20+
loaders: [
21+
{
22+
test: /\.js$/,
23+
loaders: ['babel'],
24+
exclude: /node_modules/,
25+
include: __dirname
26+
}
27+
]
28+
}
29+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<title>Title</title>
6+
</head>
7+
<body>
8+
<div id="app"></div>
9+
<script src="static/dist/main.js"></script>
10+
</body>
11+
</html>
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "6",
3+
"version": "1.0.0",
4+
"description": "",
5+
"main": "index.js",
6+
"scripts": {
7+
"test": "echo \"Error: no test specified\" && exit 1"
8+
},
9+
"keywords": [],
10+
"author": "",
11+
"license": "ISC",
12+
"devDependencies": {
13+
"babel-core": "^6.25.0",
14+
"babel-loader": "^7.1.0",
15+
"babel-preset-es2016": "^6.24.1",
16+
"babel-preset-react": "^6.24.1",
17+
"babel-preset-react-hmre": "^1.1.1",
18+
"babel-register": "^6.24.1",
19+
"express": "^4.15.3",
20+
"react": "^15.6.1",
21+
"react-dom": "^15.6.1",
22+
"webpack": "^3.0.0",
23+
"webpack-dev-middleware": "^1.11.0",
24+
"webpack-hot-middleware": "^2.18.0"
25+
}
26+
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import React from 'react';
2+
3+
export default class Counter extends React.Component{
4+
constructor(){
5+
super();
6+
this.state = {value:0};
7+
}
8+
j
9+
render() {
10+
return (
11+
<div>
12+
<button onClick={()=>this.setState({value:this.state.value+1})}>
13+
INCREMENT
14+
</button>
15+
Counter组件的内部状态
16+
<pre>{JSON.stringify(this.state,null,2)}</pre>
17+
</div>
18+
);
19+
}
20+
21+
};
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
var path = require('path')
2+
var webpack = require('webpack')
3+
4+
module.exports = {
5+
devtool:'cheap-module-eval-source-map',
6+
entry:'./src/Counter',
7+
output:{
8+
path:__dirname+'/static/dist',
9+
filename:'main.js'
10+
},
11+
// plugins:[
12+
// new webpack.optimize.OccurrenceOrderPlugin(),
13+
// new webpack.HotModuleReplacementPlugin()
14+
// ],
15+
module:{
16+
loaders:[{test:/\.js$/,exclude:/node_modules/,loaders:['babel-loader'],include:__dirname}]
17+
}
18+
};

0 commit comments

Comments
 (0)