学习react(二)

react-dom的作用

把react生成的内容挂载到html页面中的一个节点上,显示出react组件内容
react提供了jsx语法

dangerouslySetInnerHTML类似于vue:v-html

dangerouslySetInnerHTML={{__html:变量名}}
用于富文本的展示

react中给label绑定关联标签使用

react数据视图更新原理

1.state 数据

2.JSX 模板

3.数据+模板 生成虚拟DOM(虚拟DOM本质就是一个JS对象,用它来描述真实DOM)(在这一步损耗了性能)
虚拟DOM格式:['div',{id:'headerRoot'},['span',{},'hello world!']]

4.用虚拟DOM的结构生成真实DOM,来在浏览器中显示,即页面的渲染
真实DOM格式:
hello world!
5.state 发生变化 6.数据+模板 生成新的虚拟DOM (极大提升了性能) 虚拟DOM格式:['div',{id:'headerRoot'},['span',{},'hello hello!']] 7.比较原始虚拟DOM和新的虚拟DOM的区别,找到区别,替换区别处 8.直接操作DOM,改变span的值为hello hello!

你可能感兴趣的:(React,react.js,学习,javascript)