react初入学习笔记

搭建react运行环境 （先装node.js）
命令提示符（cmd）
1.安装命令react：npm install -g create-react-app
2.用cd切换到已创建的文件夹下，（例：g: 回车 cd 001/react 这样）
3.创建react项目文件名 create-react-app demo01（这个是文件名，随便取）
4.然后再demo01这个项目文件下按住shift+右击 选择“在此处打开命令窗口” 输入npm start（或者其他，例如：npm run dev之类的）
5.这样就可以运行项目了，运行后页面自动跳出来
项目文件含义
Node_modules 用于存放项目的依赖包，也就是构建这个react项目可能会用懂啊的工具
Public 文件夹中是index.html存放目录，react根页面的所在地
Src中用于存放js文件
Package.json用于记录项目信息，配置信息

学习react
1.React的index.html中，

div的id要和index.js文件中的document.getElementById(‘div1’)的id对应；
2.Js文件引入import xxx from ‘./文件名.js’ ReactDOM.render(,document.getElementById(‘div1’))对应（浅绿色要对应） 在react中，xxx的首个字母要大写（浅绿色都要）
3.在该文件名.js中，class xx extends Component{render(){return (

)}}与export default xx 要对应（红色对应）
4.在该文件名.js中，用import ‘./css文件名’引入css样式文件
5.在该文件名.js中，要给标签使用class，必须要把class改为className
6.在该文件名.js中，要使用图片，先import 随便取一个名 from ‘./图片名.jpg’ 引用图片，然后再img的src={随便取一个名} 注意：src后面不能使用””双引号，直接使用{}，然后花括号里放import的名称
7.在该文件名.js中，render中的return下只能有一个父元素，其他都要被包裹在里面
8.Constructor(){}里面要先放置一个super（）；不然会报错（super未初始化）
9.Constructor(){}里面的this.state={name:”tom”}是在设置数据，是一个对象,在return中使用{ this.state.name}就可以在页面上显示tom数据
10.注意：如果ReactDOM.render(,document.getElementById(‘div1’))这个放在该文件名.js下，那么就要class xxx extends Component对应（红色） 要与2 3区分 在</>里，首个字母要大写，不然会报错（is unrecognized in this browser）
11.标签要使用事件（例如点击事件），那么必须要在Constructor(){}里面写一个this.绑定名=this.绑定名.bind(this),这样this才能在回调函数中使用，不然会报错（cannot read property “setState” of undefined）,有多个就要声明多个
12.多个组件使用

13.react数据循环（名称要与颜色对应）

14.react的ajax请求

最后，如果我的笔记对您有帮助，请给我一个赞~ 谢谢！