Flutter (三) 狀態管理

簡介:Flutter 界面狀態分為無狀態和有狀態兩種
1.無狀態(StatelessWidget):界面一旦渲染出來就不會再改變
2.有狀態(StatefulWidget) :界面可以隨著數據的變化而變化
1.StatelessWidget(無狀態)

在build(BuildContext context) 里面子部件的樣式或者狀態是不會再發生改變。 如果想改變必須將StateManagerDemo干掉、重新創建一個.事例代碼如下:

class StateManagerDemo extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container();
  }
}
2.StatefulWidget(有狀態)

StatefulWidget就會告訴Flutter 下面代碼中StateManagerDemo 是會發生變化的.事例代碼如下:

//描述UI  定義外觀的  這個類里面顯示什么樣子是由下面_SMDState這個狀態管理者說了算
class StateManagerDemo extends StatefulWidget {
  //構造方法
  @override
  State<StatefulWidget> createState() {
    return _SMDState();//返回狀態管理者
  }
}

//管理狀態    當_SMDState里面的數據發生變化的時候。就會刷新上面StateManagerDemo
class _SMDState extends State<StateManagerDemo>{
  //狀態-->數據
  int count = 0;
  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      appBar: AppBar(
        title: Text('StateMangerDemo'),
      ),
      body: Center(
        child: Chip(label: Text('$count')),
      ),
      floatingActionButton: FloatingActionButton(
        child: Icon(Icons.add),
        onPressed: (){
          count += 1;
          setState(() {});//重新刷新(渲染)!
          print('count = $count');
        },
      ),

    );
  }
}

注:上面方法是成對出現的。當數據改變刷新界面時需要調用{setState(() {});(重新刷新(渲染)!)}

更形象的描述上述(有狀態的)兩個方法可以通俗的理解為:
1.比如StateManagerDemo 里面指定義了Label 和 Image 等
2._SMDState 里面會將Label 和 Image 等需要顯示成什么樣子渲染出來

QQ:522608370

Flutter (二)布局
Flutter (三) 狀態管理
Flutter (四) Map轉模型
Flutter (五) 網絡請求
Flutter (六) 保留界面狀態
Flutter (七) 混合開發 [配置]
Flutter (八) 混合開發 [Flutter完整項目嵌入到原生]

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容