1:页面显示
app 引入核心文件 创建虚拟dom 传入dom 获取到当前的dom元素 渲染完成
2:创建时有两种选择,一种是js模式 一种是jsx模式 推荐jsx模式看着简洁方便。
js里面
creat太多繁琐
3, 虚拟dom比真实dom的好处。
小1:虚拟的是一个对象,操作方便
小2:相比较于真实dom更加轻量东西比真实dom少,操作简洁减少,dom操作
小3,虚拟的最终还会被react渲染成真实的dom放到页面中
4,jsx语法规则
小1:里面要是js语法要用{}来写
小2:类名需要使用className自动渲染成class
小3:在写style属性的时候要用双大括号来表示{{color:”red“}}
小4:不可以写注释信息
小5:div大写不可以 会被渲染成组件
小6:在jsx中如果想写js 必须写js表达式(返回一个值)而不是语法
5,模块和模块化的区别
模块是对于部分js代码的封装 大部分都是js文件
模块化 是 一个大的应用 由许多小的应用组成
5:组件和组件化的区别
组件: 是局部功能 js html css img
组件化: 是一个大的应用有很多功能组成
6:函数指向问题
7:用babel就相当于开启了严格模式 普通函数的this指向就为nan
8:函数组件的时候还有就是用组件标签渲染 一般不用()进行渲染一般会带有子组件
9:类组件必须写继承,他是从react里面出来的,不用new 在渲染的时候自动new,this 指向的是 new出来的 实例
10:state:标签上点击事件上绑定change这个方法,这样点击state就会触发cahnge方法然后根据state来修改值 先结构赋值给state 但是再change中不能直接修改state这样会把对象中的state修改,所以在构造函数初始化那里把原本change指向为underfined用bind改为指向构造函数这样就会在执行了 他会自动调用render 再用setState 他会修改 state
这样我就实现了一个事件的点击