一、react介紹
官網(wǎng)：React (docschina.org)
react是由facebook前端開發(fā)團隊開發(fā)和維護的js框架
react的實現(xiàn)功能類似VUE，但是由于國外的開發(fā)風格，導(dǎo)致在react上，并沒有對數(shù)據(jù)渲染的步驟進行封裝，需要開發(fā)者更多的使用es6的語法手動完成數(shù)據(jù)渲染，所以，代碼難度比VUE高。
二、react的優(yōu)缺點
優(yōu)點：
1.一切皆組件：在react中幾乎都是使用組件進行開發(fā)，好處：提高代碼的復(fù)用率和可維護性
2.速度快：在react中提供了虛擬DOM機制（virtual DOM）
3.跨瀏覽器兼容：在react中采用虛擬DOM，不直接解析真實的DOM，解決了跨域瀏覽器兼容的問題，甚至在IE8中都可以使用。
4.同構(gòu)，純粹的JavaScript：在整個項目開發(fā)中，幾乎都是使用JavaScript進行開發(fā)
5.單向數(shù)據(jù)流：在react中提供了兩個架構(gòu)：flux和redux來構(gòu)建單向數(shù)據(jù)流
缺點：
1.不是一個完整的框架
2.react頂多在MVC中算V層（視圖層），一般需要結(jié)合reactRouter和redux來構(gòu)建完整的項目。
三、react的安裝及使用
cdn：進入官網(wǎng)，按圖順序點擊
?
?
?
????????之后會出現(xiàn)一個html文檔，這是react的基本使用文檔?？梢渣c擊鼠標右鍵選擇另存為保存到桌面（或任意文件夾）。
???????? 紅框圈住的是react在線cdn鏈接，沒網(wǎng)不能使用。也可以復(fù)制紅框內(nèi)容在新的頁面打開，把全部代碼保存到本地。
?用vscode打開此html文件，即可出現(xiàn)以下效果
此時的html全部代碼為（注釋為我個人理解）
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Hello World</title>
<script src="https://unpkg.com/react@18/umd/react.development.js"></script>
<script src="https://unpkg.com/react-dom@18/umd/react-dom.development.js"></script>
<!-- Don't use this in production: -->
<script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
</head>
<body>
<div id="root"></div> <!-- 聲明需要渲染的區(qū)域 -->
<script type="text/babel">
function MyApp() {
return <h1>Hello, world!</h1>;
}
const container = document.getElementById('root'); // 捕獲渲染區(qū)域
const root = ReactDOM.createRoot(container); //創(chuàng)建DOM元素
root.render(<MyApp />); //將DOM元素渲染到渲染區(qū)域當中
</script>
</body>
</html>?npm
npm init -y ? //初始化package.json文章來源：http://www.zghlxwxcb.cn/news/detail-812047.html
npm i react react-dom -S文章來源地址http://www.zghlxwxcb.cn/news/detail-812047.html
到了這里，關(guān)于React框架的介紹、特點、安裝及基本使用流程的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
