當(dāng)前位置：首頁 > 编程资源 > 编程问答 >内容正文

编程问答

reactjs定义组件：类式组件

發(fā)布時(shí)間：2025/1/21 编程问答 14 豆豆

生活随笔收集整理的這篇文章主要介紹了 reactjs定义组件：类式组件小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.

執(zhí)行了ReactDOM.render(…之后，發(fā)生了什么？
1.React解析組件標(biāo)簽，找到了MyComponent組件。
2.發(fā)現(xiàn)組件是使用類定義的，隨后new出來該類的實(shí)例，并通過該實(shí)例調(diào)用到原型上的render方法。
3.將render返回的虛擬DOM轉(zhuǎn)為真實(shí)DOM，隨后呈現(xiàn)在頁面中。

<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>2_類式組件</title> </head> <body><div id="test"></div><script type="text/javascript" src="../js/react.development.js"></script><script type="text/javascript" src="../js/react-dom.development.js"></script><script type="text/javascript" src="../js/babel.min.js"></script><script type="text/babel">//1.創(chuàng)建類式組件class MyComponent extends React.Component {render(){//render是放在哪里的？—— MyComponent的原型對(duì)象上，供實(shí)例使用。//render中的this是誰？—— MyComponent的實(shí)例對(duì)象 <=> MyComponent組件實(shí)例對(duì)象。console.log('render中的this:',this);return <h2>我是用類定義的組件(適用于【復(fù)雜組件】的定義)</h2>}}//2.渲染組件到頁面ReactDOM.render(<MyComponent/>,document.getElementById('test'))/* 執(zhí)行了ReactDOM.render(<MyComponent/>.......之后，發(fā)生了什么？1.React解析組件標(biāo)簽，找到了MyComponent組件。2.發(fā)現(xiàn)組件是使用類定義的，隨后new出來該類的實(shí)例，并通過該實(shí)例調(diào)用到原型上的render方法。3.將render返回的虛擬DOM轉(zhuǎn)為真實(shí)DOM，隨后呈現(xiàn)在頁面中。*/</script> </body> </html>

總結(jié)

以上是生活随笔為你收集整理的reactjs定义组件：类式组件的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。

上一篇： reactjs组件实例的三大属性之pro
下一篇： reactjs定义组件：函数式组件

3atv精品不卡视频,97人人超碰国产精品最新,中文字幕av一区二区三区人妻少妇,久久久精品波多野结衣,日韩一区二区三区精品

编程问答

reactjs定义组件：类式组件

總結(jié)