react狀態組件有哪些

react狀態組件有2種：1、有狀態組件，是能定義state的組件，應用于需要更改數據的地方；2、無狀態組件，是不能定義state的組件，一般應用在本身就沒有數據更改的地方。

本教程操作環境：Windows7系統、react17.0.1版、Dell G3電腦。

React組件：有狀態組件和無狀態組件件

1、什么是組件狀態

定義：是用來描述事務在某一時刻的形態的數據。一般寫作state。

特點：狀態能夠被改變，改變之后視圖會發生相應的變化

作用：(1)保存數據(2)為后續更新視圖打下基礎

比如，設計一個計數器，點擊+1按鈕后計數器的數字會變化為原數字+1

2、兩種狀態

2.1無狀態組件：不能定義state的組件，函數組件又叫無狀態組件

無狀態組件一般應用在本身就沒有數據更改的地方，比如渲染一段商品的介紹文字，它不需要實時更新，它最大的好處時可以隨時復用

2.2有狀態組件：能定義state的組件，類數組件又叫有狀態組件

有狀態組件的應用場景就寬泛的多了，基本上所有需要更改數據的地方都有它的身影

3.類組件狀態實例

import React from "react"; export default class Hello extends React.Component {   // 這里的state就是狀態   state = {     list: [{ id: 1, name: "明天會更好" },{ id: 2, name: "難忘今宵" }],     isLoading: true   }; }     render() { //如果當state里的數據種類較多時可以使用解構賦值 // 例如：const { tabs, active, list, content } = this.state     return (       <>         <h1>歌單-{this.state.count}</h1>         <ul>           {this.state.list.map((item) => (             <li key={item.id}>{item.name}</li>           ))}         </ul>         <div>{this.state.isLoading ? "正在加載" : "加載完成"}</div>       </>     );   }

【