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
blog comments powered by Disqus