Flutter实战指南
上QQ阅读APP看书,第一时间看更新

5.3 根据条件渲染列表内容

目前已经学习了很多关于ListView的内容,在main.dart中,当我们不给NewsManager小部件传值的时候,NewsManager中的startingNews的值是空的,可以在NewsManager的initState()方法中检查它是否为空。在不为空的情况下,再把它添加到news列表中,代码如下:

然后可以在main.dart中给命名参数startingNews赋值,这里加的if语句是条件语句。

在列表中,如果有news的数据就把它输出到的ListView列表中,如果没有任何news可以显示其他的内容。例如使用文本替代,所以在ListView中可以实现根据某些条件的不同而来显示不同的内容,我们可以通过多种方式来实现这一点。

最快的方式就是在News小部件中的build()方法中做修改。这里可以检查属性news的长度,如果news的长度大于0,输出列表,否则返回需要显示的小部件,这里我们显示居中的文字,代码如下:

保存并重启,会发现居中文字显示出来了,如果添加一个news就到了一个列表。以上就是使用条件来渲染的列表。如果条件简单这样编写就可以,如果条件复杂可以使用另外一种方式。下一节介绍根据条件渲染列表的替代方案。