StatelessWidget 无状态组件 StatefulWidget 有状态组件 页面上绑定数据、改变页面数据

一、Flutter 中自定义有状态组件

在 Flutter 中自定义组件其实就是一个类，这个类需要继承 StatelessWidget/StatefulWidget。

StatelessWidget 是无状态组件，状态不可变的 widget

StatefulWidget 是有状态组件，持有的状态可能在 widget 生命周期改变。

通俗的讲：如果我们想改变页面中的数据的话这个时候就需要用到 StatefulWidget 和  setState(() {})
 

 

class HomeCenter extends StatefulWidget{
  HomeCenter({Key key});
  _HomeCenterState createState() => _HomeCenterState();
}

class _HomeCenterState extends State {
  var list = [];
  @override
  Widget build(BuildContext context) {
    // TODO: implement build
    return ListView(
      children: [
        Column(
          children: list.map((val) {
            return Text(val['title']);
          }).toList(),
        ),
        Container(
          child:   RaisedButton(
              child: Text('点击'),
              onPressed: () {
                setState(() {
                  this.list.add({
                    'title': '111'
                  });
                });
              }
          ),
        )
      ]
    );
  }
}