因公司项目需要，所以菜渣如我（jq都没玩明白的人），也要开始学习react了
这里是后面的整理，并无抄袭之意
废话不多说，开始
一、起手式
1.1首先，肯定是引入react
import react from 'react';
如果已经
npm install react，那就直接引入吧，如果没有，那就在html里
let Demo = React.createClass({
render(){
return (
Hello, world!
)
}
});
const app = document.createElement('div');
document.body.appendChild(app);
ReactDOM.render(解释一下这一坨子是什么东西：
声明一个组件类，个人理解就是创建一个自定义的dom标签，但是呢，这个首字母要大写。
（PS：如果使用的是webstorm，file→settings→languages&frameworks→javascript，右侧选择JSX Harmony 或者选择Flow,这个是为了让webstorm支持JSX语法。）
1.2再补一个新的知识点
let Test = React.createClass({
render(){
return(
初学react
撸两行试试
我笨，就要更努力
)
}
});
这个是说明一个事情，就是，render的return中，只能有一个顶级标签，也就是外层的那个div，不然编译不通过会报错，有的，编辑器在编译之前就报错了。另外，这里return之后的dom没有引号，因为jsx语法可以不用，但是类似于className，data私有属性等则需要加引号。
注意：在react编写过程中，记得要使用className代替元素标签的class，htmlFor代替label的for，原因是，因为是jsx语法，所以，js和html混合写在一起，class和for都是关键字，所以把html中的这两个替换掉
2.1 render中逻辑语法相关
let Test = React.createClass({
render(){
return (
{1+1}
)
}
})
在render的return里，如果有js语法需要添加到{}里，在return中，元素标签里的{}里写的是js代码，可以写代码中的这种，{}中的js要写成表达式，可以是带有return的function，如果要写判断，请使用三元。如下
ReactDOM.render(
{
names.map((name) =>{
return Hello, {name}!
})
}
,
document.getElementById('example')
);
或者
var i = 1;
ReactDOM.render(
{i==1?'True。':'False。'}
,
document.getElementById('test')
);
3.1允许加入js中的变量（如果是数组，则会展示全部）
var arr = [
'Hello world!
',
'React is awesome
',
];
ReactDOM.render(
{arr},
document.getElementById('example')
);
4、写了，样式也得加不是？
React要使用camelCase语法来设置内联样式，React会在指定元素数字后面自动添加px，如下：
var testStyle = {
fontSize: 100,
color: '#FF0000'
};
ReactDOM.render(
样式Demo
,
document.getElementById('example')
);
或者
ReactDOM.render(
样式Demo
,
document.getElementById('example')
);
这里补一刀，return里的注释要在{}中写
ReactDOM.render(
测试注释
{/*注释...*/}
,
document.getElementById('example')
);
补一个小知识点
const arr = [1,2,3,4,5,6,7];
render(){
return (
arr.map((item,index)=>{
return (
{item}
)
})
)
}
敲黑板敲黑板，react的遍历中，记得加入key={}
这个key通常是唯一不变的，最好是id之类，这里是示例，就用了index
但是，最好不要使用index当成key，如果是可拖动列表，index会改变的。
这个key，是告诉state，在比对的时候以什么为参考
不加key，浏览器的控制台会报warning的
以上，是react基础中的基础，反正我是这么认为的。下一页，是state和props。