到目前为止,当我需要在小部件中使用条件语句时,我已经做了以下工作(使用中心和容器作为简化的虚拟示例):
new Center(
child: condition == true ? new Container() : new Container()
)
虽然当我尝试使用if/else语句时,它会导致一个死亡代码警告:
new Center(
child:
if(condition == true){
new Container();
}else{
new Container();
}
)
有趣的是,我尝试了一个switch case语句,它给了我同样的警告,因此我不能运行代码。我做错了什么,或者它是这样的,不能使用if/else或开关语句而不颤振认为有死代码?
在Flutter中,条件渲染可以通过附带条款包轻松完成。
它有一组全面的条件小部件和构建器,可以生成可读性更强、更简单的条件语句代码。
API和helper包括但不限于:
条件小部件和构建器:
ConditionWidget(
condition: starred,
widget: Icon(
Icons.favorite
),
fallback: fallbackWidget
)
ConditionBuilder(
condition: (_) => someCondition,
trueBuilder: (_) => trueWidget,
fallbackBuilder: (_) => fallbackWidget
)
开关机箱条件:
SwitchCaseBuilder.widget<String>(
context: context,
condition: (_) => '1',
caseBuilders: {'1': (_) => someWidget(), '2': (_) => someWidget()},
fallbackBuilder: (_) => fallbackWidget,
);
甚至是一个有条件的父小部件
ConditionalWrap(
shouldWrap: shouldWrapChildInParent,
child: Container(),
parentBuilder: (child) => Container(
child: child,
),
)
API支持单个或多个小部件呈现。
欢迎你试一试。
你可以在dart中对条件语句使用三元运算符,它的使用很简单
(condition) ? statement1 : statement2
如果条件为真,则执行statement1,否则执行statement2。
举一个实际的例子
Center(child: condition ? Widget1() : Widget2())
请记住,如果您打算使用null作为Widget2,最好使用sizebox .shrink(),因为一些父部件将在获得null子部件后抛出异常。
在这种情况下,我建议使用三元操作符:
条件?Container(): Center()
并尽量避免使用如下形式的代码:
if (condition)返回A否则返回B
这比三元运算符更冗长。
但如果需要更多的逻辑,你还可以:
使用Builder小部件
Builder小部件是为了允许在需要子小部件时使用闭包:
一个柏拉图式的小部件,它调用闭包来获取它的子小部件。
任何时候你需要逻辑来构建小部件都很方便,它避免了创建专用函数的需要。
你使用Builder小部件作为子组件,你在它的Builder方法中提供你的逻辑:
Center(
child: Builder(
builder: (context) {
// any logic needed...
final condition = _whateverLogicNeeded();
return condition
? Container();
: Center();
}
)
)
Builder为保存创建逻辑提供了一个方便的地方。它比atreeon提出的直接匿名函数更直接。
我也同意逻辑应该从UI代码中提取出来,但当它真的是UI逻辑时,有时保留它更容易读懂。