React是一個用於構建用戶界面的JavaScript庫,具有聲明式、組件化等特點,主要用於構建UI,類似於MVC模式中的V(視圖層)。以下是React的基本用法:
安裝。使用npm安裝React和react-dom,其中react是核心包,提供創建元素、組件等功能,react-dom包提供DOM相關的功能。
引入。在HTML檔案中引入react和react-dom兩個js檔案。
創建React元素。使用React.createElement()方法創建React元素,該方法接受元素名稱、元素屬性、元素的子節點等參數。
渲染React元素到頁面中。使用ReactDOM.render()方法將創建的React元素渲染到頁面的指定元素中。
使用JSX。JSX是JavaScript XML的簡稱,是JavaScript的語法擴展,用於編寫React組件的結構。
使用狀態(State)。狀態用於管理組件內部的數據和狀態,通過this.state來獲取屬性值,使用this.setState來更新設定數據。
組件。React支持使用函式或類來定義組件,函式組件是無狀態的組件,類組件可以有狀態。
事件處理。可以通過在元素屬性中添加事件處理器,如onClick,來處理用戶互動。
使用Hooks。Hooks是React的一個高級功能,允許你在不編寫class的情況下使用state以及其他React特性。
以上是React的基本用法,隨著技術的發展,React社區提供了許多高級功能和工具,如Hooks、Context API、React Router等,使得開發更加高效和靈活。