Beginner react

React Features:

Statement design; JSX recommended to describe the user interface; building element; unidirectional response data stream;

JSX: JSX is one kind of syntax extensions JAVASCRIPT, the element is the smallest unit of constituting react, JSX is used in the element declaration REACT.

1. Specify attributes: JSX quotes can be specified as the attribute value is string; const element = <div tableIndex = "0"> </ div>

　　　　　　JSX braces can be used to define the expression in javascript attribute value; const element = <div> {name} </ div> camelCase small;

2. Nested Scheme: JSX Like HTML, the closure tab may be nested within one another;

　　　　　　const element = ( <div> <img src="***"/></div>)

3 using the expression: may be used in any expression JSX in javascript, but on the braces; while adding a small outside parentheses JSX code is automatically inserted to prevent bugs semicolon;

　　　　　const element = ( <div> <h1>{ hi,{format(createTime)}}</h1></div>)

　　　　　It can be used for inside or if, he will be assigned to variables, passed as a parameter or as a return value;

1 function gettingData(user){
2   if(user){
3   　return <h1>hello,{format(user)}</h1>      
4 　}else{
5 　　return <h2>hello,stranger!</h2>
6 　}
7 }

4. Anti injection attacks: all the content before rendering is converted to a string, and this can effectively prevent XSS.

5 represents the object: Babel translator JSX will be converted into a method named React.createElement () call;

　　The following two paragraphs like this:

　　const element = (<div> <h1 className="getting">hello</h1></div>)

　　React.createElement('h1', {className: 'getting'}, 'hello')

installation:

By using NPM react, install Taobao Mirror:

the install NPM - G CNPM - Registry = HTTPS : //registry.npm.taobao.org NPM config SET Registry HTTPS : //registry.npm.taobao.org 
using creat-react-app quickly build React development environment; creat-react -app project is automatically created based on webpack + ES6;

$ cnpm install -g create-react-app $ create-react-app my-app $ cd my-app/ $ npm start

Guess you like