Please enable JavaScript.
Coggle requires JavaScript to display documents.
重读react官方文档（基础） (元素渲染 (特点： (不可变对象，一旦被创建，就无法更改它的子元素会属性，就像电影的单帧，代表某个特定时刻的ui,…
重读react官方文档（基础）
元素渲染
-
特点：
- 不可变对象，一旦被创建，就无法更改它的子元素会属性，就像电影的单帧，代表某个特定时刻的ui
- 如何更新？ 更新ui的唯一方式是创建一个全新的元素，并将其传入ReacDom.render()
-
-
jsx
为什么要使用jsx?
React 认为渲染逻辑本质上与其他 UI 逻辑内在耦合， 比如在ui中需要绑定处理时间，在某些时刻状态发生僧变化是需要通知到ui,以及需要在ui中展示准备好的数据
-
-
-
-
-
生命周期&&State
-
state
更新
出于性能考虑，React可能会把多个setState调用合并成一个调用。因为this.props和this.state了能会异步更新，所以你不要依赖他们的值来更行下一个状态，如果需要使用上一次的prop, 可以在setState中的箭头函数调用this.setState((state, props) => ({ coubter: state.counter + props.increment }))
-
事件处理
jsx中回调函数中的this，在js中，class的方法默认不会绑定this,所以如果没有在方法后面添加(),那么应该为这个方法绑定this
-
-
-
向事件处理程序传递参数
箭头函数
onClick={(e) => this.deleteRow(id, e)
Function.prototype.bind
onClick={this.deleteRow.bind(this, id)
-
表单
由于react处理的特殊性，所以inpurt ,textarea 和select之类的标签都会接受一个value属性
受控组件与非受控组件
受控组件
在 HTML 中，表单元素（如<input>、 <textarea> 和 <select>）之类的表单元素通常自己维护 state，并根据用户输入进行更新。而在 React 中，可变状态（mutable state）通常保存在组件的 state 属性中，并且只能通过使用 setState()来更新。
我们可以把两者结合起来，使 React 的 state 成为“唯一数据源”。渲染表单的 React 组件还控制着用户输入过程中表单发生的操作。被 React 以这种方式控制取值的表单输入元素就叫做“受控组件”。
-
-
-
-