前端做界面都要求會組件化 ， 今天咪咪我就來分享一下react怎樣編寫組件 ， 希望可以幫助到大家 。 工具/材料 電腦
【怎樣編寫react組件】hbuilder
react.js,react-dom.js,browser.js
操作方法 01 首先 ， 現在HTML頁面中定義一個div ， 這個div待會用來存放react組件 。
02 接著在HTML頁面引入這三個插件 ， 具體可以到react官網下載 ， 需要注意的是react-dom.js要放在react.js的后面 ， 不然會報錯哦 。
03 接著再寫一個script標簽 ， 要把type設置成text/babel哦 。
04 然后自定義一個組件名 ， 比如我這里自定義為Zhinan ， 注意 ， react的組件名開頭一定要大寫字母哦 。
05 然后我們調用React.createClass({})來創建一個組件 。
06 接著在React.createClass({})里面調用rer:function 。 rer:function()是一個渲染函數 。
07 然后我們在渲染函數里面開始編寫代碼 ， 這里我就設置顯示一個<h1>標簽 。 這樣 ， 一個簡單的react組件就編寫完成了 。
08 接著調用ReactDOM.rer()來把組件插入到之前定義好的div里就可以了 。
09 如圖 ， 插入方法如下 ， 把組件當做是一個HTML標簽 ， 注意要有/斜杠哦 ， 并且要加上一個逗號 ， 還有就是document語句后面不可以加分號 。
10 最后瀏覽一下HTML界面 ， 顯示成功 ， 說明組件已經成功插入到div里面了 。
以上內容就是怎樣編寫react組件的內容啦 ， 希望對你有所幫助哦！
猜你喜歡
- ps里怎樣快速的去掉水印
- 怎樣正確處理手上扎刺
- 老年人頭暈是什么原因引起的，該怎樣治療？
- 蘆薈怎樣種植？蘆薈一般用分株法種植
- 怎樣用雙皮奶粉制成雙皮奶
- 報春花怎樣扦播
- 怎樣治療白帶發黃
- 雙面玻璃擦吸住了怎么打開 怎樣分開玻璃擦
- 怎樣防治黃水瘡？
- 拔牙是怎樣的一個流程？