Flutter showModalBottomSheet无法更新状态问题

方法一：

很多人在使用 showDialog 或者 showModalBottomSheet 的时候，都会遇到这个问题：通过 setState 方法无法更新当前的dialog。

原因其实很简单，dialog本质上是另一个页面，确切点说是另一个路由，它的地位跟你当前主页面是一样的。在Android或者iOS中，dialog都是依附于当前主页面的一个控件，但是在Flutter中它是一个新的路由。所以，你使用当前页面的 setState 方法当然是没法更新dialog中的内容的。

那么，如何更新dialog中的内容呢？答案是使用StatefulBuilder。

bool checked = false;

showModalBottomSheet(
  	context: context,
	builder: (context) => StatefulBuilder(
	    builder: (context, setState) {
            return SizedBox(
            	height: 220,
            	child: Container(
            		child: Column(
            			children: [
							Checkbox(
								value: checked,
								onChanged: (value){
									if(value != null){
										setState((){
											checked = value;
										})
									}
								}
							)
						]
            		)
            	)
            );

方法二：

通过调用父组件的方法来实现状态的更新，示例代码如下：

class MyPage extends StatelessWidget {
	bool a = true;
	void updateA(value){
		setState((){
			a = value;
		})
	}
	@override
	build(BuildContext context) {
		return TextButton(
			child: Text('弹出下滑框'),
			onPressed: () {
				 showModalBottomSheet(
                     context: context,
                     builder: (context){
                     	return SizedBox(
			            	height: 220,
			            	child: Container(
			            		child: Column(
			            			children: [
										Checkbox(
											value: a ,
											onChanged: (value){
												updateA(value);	
											}
										)
									]
			            		)
			            	)
			            );
                     }
             	)   
			}
		);
	} 
}