ReactJs簡介
發(fā)布于：2021-02-07 09:25:20
既然您已經(jīng)到了這篇文章，我肯定不需要深入解釋什么是ReactJs，它的優(yōu)點是什么，為什么它是如此的酷，或者為什么它比Angular甚至Vue.js都不錯。
如果您在這里，請確保您已經(jīng)掌握了以上所有內(nèi)容，但本文的目的不是要重復(fù)此步驟，而是要進行足夠友好的介紹，以便您從Web編程開始但仍然不具備所有基礎(chǔ)知識和基本知識。它是前端，后端或全棧Web開發(fā)所必需的，但是您很好奇，想使用ReactJ，繼續(xù)獲取它們就可以進行實驗，而無需了解React開發(fā)環(huán)境的樣板（npm，webpack，babel等等...），您可以在幾分鐘內(nèi)和在線創(chuàng)建您的第一個組件。
第1部分-ReactDOM
工具類
ReactDOM是負責(zé)將組件放置在DOM中并對其進行解釋的庫，這些組件是使用ReactJs創(chuàng)建的，這些版本15中的庫是兩個單獨的庫，但同時它們又一起工作，首先我們要打開jsbin .com。并使用“添加庫”按鈕安裝ReactJS，讓我們找到ReactJs。
一旦安裝了React js，我們就可以創(chuàng)建我們的第一個組件并將其放置在DOM中，為此，我們將放置一個標(biāo)簽
在編輯器的左側(cè)具有id root的情況下，請記住我們之間有幾個部分：html，css，javascript，控制臺和輸出，我們將僅激活html，javascript和html。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <div id="root" ></div> </body> </html>
您的第一個組件
在javascript部分中，我們必須選擇正確的編譯器，這是選擇javascript而不是“ ES6 / Babel”，我們將編寫第一個組件：
const App = () => ( <div> BlisS </div> ) ReactDOM.render(<App/>, root)
讓我們觀察一下ReactDOM的render方法接收2個參數(shù)，第一個是我們要以jsx格式（如html標(biāo)簽）放置的React組件，第二個是我們想要放置它的位置，我們可以傳遞第二個帶有文檔選擇器.getElementById（'root'）的參數(shù)，但在較新版本的ReactDOM中，即使沒有引號，ID的名稱也已足夠。
我們應(yīng)該在Output部分中看到結(jié)果，這使我們知道我們的代碼有效。
這非常簡單，但是它使我們了解了什么是組件以及ReactJs作為簡單庫如何工作。
您已經(jīng)用ReactJs創(chuàng)建了第一個組件Feliciades，并且已經(jīng)在DOM中渲染了它。
