（1）状态提升（中间人模式）React中的状态提升概括来说，就是将多个组件需要共享的状态提升到他们最近的父组件上，在父组件上改变这个状态然后通过props分发给子组件importReact,{Component}fromreactimportaxiosfromaxiosimport../01-base/css/02-卖座.css//受控组件classFilmItemextendsComponent{ render(){ console.log(this.props) let{name,poster,grade,synop
表单中的受控组件和非受控组件
（广义范围的说法）：React组件的数据渲染是否被调用者传递的props完全控制，控制则为受控组件，否则为非受控组件表单中的受控与非受控组件：React要编写一个非受控组件，可以使用ref来从从节点中获取表单数据，就是非受控组件非受控组件：importReact,{Component}fromreactexportdefaultclassAppextendsComponent{ myusername=React.createRef() render(){ return( <div>
属性（props）父传子（React）
父传子：父：importReact,{Component}fromreactexportdefaultclassnavbarextendsComponent{render(){let{title,leftShow,rightShow}=this.props;//属性是父组件传来的，this.propsreturn(<div>{leftShow?<button>left</button>:null}<
受控与非受控的表单域组件（事例练习）
非受控的表单域组件：importReact,{Component}fromreactclassFiledextendsComponent{ state={ value: } render(){ return( <divstyle={{background:"yellow"}}> <label>{this.props.label}</label> <inputtyp
create-react-app|组件|事件处理（React）
全局安装create-react-appnpmi-gcreate-react-app创建一个项目create-react-app项目名---------------------------------如果不想重新安装npxcreate-react-appmyapp编写第一个react程序JSX：babel的JSX编译器实现：由2自动转化为1importReactfromreact;importReactDOMfromreact-domReactDOM.render(<div>1111111111</div>,docume
setState||better-scroll
setState异步更新状态，更新真实dom这时候可以使用 react-dom 提供的 flushSync，使得同步更新 dom：importReact,{Component}fromreactimport{flushSync}fromreact-dom;exportdefaultclassAppextendsComponent{ state={ count:1 } render(){ return( <div&g
子传父（React）
子传父是通过回调函数importReact,{Component}fromreactclassNavbarextendsComponent{ render(){ return( <divstyle={{background:"red"}}> <buttononClick={()=>{this.props.event()}}>click</button> <span>navbar</span> </div> )
React插槽
为了复用，一定程度上减少了父子通信父：importReact,{Component}fromreactexportdefaultclassAppextendsComponent{ render(){ return( <div> <Child> <div>11111111111111</div> <div>22222222222222</d
