脚本宝典收集整理的这篇文章主要介绍了React 学习笔记 - 元素,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
元素是构成React的最小单位。
const element = <h3>Hello world</h4>
React中的文档中提醒初学者很容易把元素和另一个内涵更加广泛的定义“组件”弄混了。注意一下。
该怎么使用元素呢?
<div id="root"></div>
然后我们把一个元素传入ReactDOM.render()
的方法来将其渲染到页面上来。
const element = <h2>Hello world</h2>
ReactDOM.render(
element,
document.getElementById('root')
);
怎么让页面动起来
React元素都是immutable不可改变的。单元素在被创建之后,你是无法改变其内容或者属性的。一个元素就是动画中的一帧,他代表应用界面在某一个时间点的样子。
那么我们想到的方法就是不断的创建新的元素,并不断的传入ReactDOM.render()函数。
function tick()
{
const element =
<div class=“demo”>
<h1>Hello world</h1>
<h2>It is {new Date().toLocaleTimeString() }</h2>
</div>
ReactDOM.render(
element,
document.getElementById('root')
)
}
setInterval(tick, 1000)
当然我们后面实际开发中应该不会写这么傻的代码,但是我们通过Source观察,React并不会更新div.demo中的所有内容,而是只更新了必要的部分,amazing
以上是脚本宝典为你收集整理的React 学习笔记 - 元素全部内容,希望文章能够帮你解决React 学习笔记 - 元素所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。