SetState() 在构造函数中调用
Posted
技术标签:
【中文标题】SetState() 在构造函数中调用【英文标题】:SetState() called in constructor 【发布时间】:2019-11-10 10:08:05 【问题描述】:我已经建立了一个自定义列表。现在我包含一个复选框,如果我要检查或取消检查,则会引发以下错误:'setState() called in constructor'
class Lists extends StatefulWidget
@override
_List createState() => _List();
class _List extends State<Lists>
bool checkedvalue = true;
@override
Widget build(BuildContext context)
return futureBuilder();
Widget futureBuilder()
var futureBuilder = new FutureBuilder(
future: rest.fetchPost(),
builder: (BuildContext context, AsyncSnapshot snapshot)
switch (snapshot.connectionState)
case ConnectionState.none:
case ConnectionState.waiting:
return new Text('loading...');
default:
if (snapshot.hasError)
return new Text('Error: $snapshot.error');
else
return listBuilder(context, snapshot);
);
return new Scaffold(
body: futureBuilder,
);
Widget listBuilder(BuildContext context, AsyncSnapshot snapshot)
List<rest.Status> values = snapshot.data;
if (values == null || values.length == 0)
return null;
int items = values.length;
return ListView.builder(
itemCount: items,
itemBuilder: (BuildContext context, int index)
String statusText;
Image image ;
Uint8List bytes;
if(statusList.globalStatus != null)
for(int i=0;i< statusList.globalStatus.length; i++)
if(values[index].statusID == statusList.globalStatus[i].id)
if(statusList.globalStatus[i].kurzform != null)
statusText = statusList.globalStatus[i].kurzform;
else
statusText = statusList.globalStatus[i].kurzform;
if (statusList.globalStatus[i].icon != null)
bytes = base64Decode(statusList.globalStatus[i].icon);
image = new Image.memory(bytes) ;
if(image== null || statusText == null)
statusText= 'Kein Status';
image= new Image.asset('assets/null.png');
return new Container(
decoration: new BoxDecoration(
border: Border(top: BorderSide(
color: Colors.black26,
width: 1
)
)
),
child:Column(
children: <Widget>[
CustomListItemTwo(
statusText: statusText,
status:image,
materialNR: values[index].uArtText,
material: values[index].untersuchungsMaterialName,
probenArt: values[index].probenart,
eingansdatum: values[index].eingangsdatumText,
patient: values[index].vorname + ' ' + values[index].nachname ,
geburtsdatum: values[index].geburtstagText ,
),
Checkbox(
value: checkedvalue ,
onChanged: (bool newValue) =>
setState(()
checkedvalue = newValue;
)
),
]
),
);
);
I/flutter (5067): ══╡ 手势发现异常╞═════════════════════════════ ═══════════════════════════════════ I/flutter (5067):处理手势时抛出以下断言: I/flutter(5067):setState() 在构造函数中调用:_List#9044e(生命周期状态:已创建,没有小部件,未安装) I/flutter (5067):当您在 State 对象上为尚未插入的小部件调用 setState() 时会发生这种情况 I/flutter (5067): 小部件树呢。没有必要在构造函数中调用 setState(),因为状态是 I/flutter (5067):在最初创建时已经假定它是脏的。
【问题讨论】:
如果它解决了您的问题,请接受答案,这样问题就不会一直悬而未决:) 【参考方案1】:我下面的代码不是 testet。
您的代码中存在一些概念错误。您应该不在构建方法中获取任何内容!
如果您打印例如在你的构建方法中“构建......”(如下所示)你会明白为什么。 build 方法被调用的次数比你想象的要多。因此,您正在调用 WebService 或不止一次,响应将不止一次。实际上setState()
方法会触发构建。
如果你想在一开始就拉一些东西,请使用initState()
方法。该方法将在状态创建时调用一次。对调用的状态使用变量,并在 build 方法中对其做出反应(如前所述,setState()
将触发重建)。
我稍微重构了你的代码,考虑到这个概念,你的开关/复选框问题可能会消失。
另外请看看如何使用Futures https://api.flutter.dev/flutter/dart-async/Future-class.html
class Lists extends StatefulWidget
@override
_List createState() => _List();
class _List extends State<Lists>
bool checkedvalue = true;
bool loading = true;
AsyncSnapshot asyncSnapshot = null;
@override
void initState()
futureBuilder();
super.initState();
@override
Widget build(BuildContext context)
print("building...");
if(asyncSnapshot != null && asyncSnapshot.hasError)
return Text("Error : $asyncSnapshot.error");
return (loading) ? Text("LOADING") : listBuilder(context, asyncSnapshot);
void futureBuilder() async
rest.fetchPost().then((snapshot)
switch (snapshot.connectionState)
case ConnectionState.none:
case ConnectionState.waiting:
setState(()
loading = true;
);
break;
default:
if (snapshot.hasError)
setState(()
loading = false;
);
else
setState(()
loading = false;
asyncSnapshot = snapshot;
);
);
.....
【讨论】:
以上是关于SetState() 在构造函数中调用的主要内容,如果未能解决你的问题,请参考以下文章
Flutter:在构造函数中调用 setState():_SharesListState#6c96a(生命周期状态:已创建,无小部件,未安装)
为啥在类构造函数中使用 setState 方法时 React 会抛出错误?