React Using Notes: 1
Basic framework:
React+
Reflux+
Webpack, with
Nodejs.
Issues I encountered:
1. When using <input>
with defaultValue, such as <input type='text' defaultValue={this.props.name} />
, if you change this.props.name, this input node will not reRender. Only when its value changed, it reRender. So using <input type='text' value={this.props.name} onChange={this.handleChange} />
instead.
2. I thought there were other problems, but they are almost about JS...
Some codes:
Offline transcode from JSX to JS:
npm install --global babel-cli
npm install babel-preset-react
babel --presets react src --watch --out-dir build
webpack.config.js:
module.exports = {
entry: "./index.js", //entryfile
output: {
path: __dirname, //localpath
filename: "bundle.js" //output filename
},
module: {
loaders: [
{ test: /\.css$/, exclude: /(node_modules|bower_components)/,loader: "style!css" },
{
test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
loader: 'babel',
query: {
presets: ['react'],
cacheDirectory:true
}
}
]
}
};
changecheng
07 December 2015