到目前为止，当我需要在小部件中使用条件语句时，我已经做了以下工作(使用中心和容器作为简化的虚拟示例):
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 Widget可以在不破坏代码树的情况下有条件地用父元素包装子树
import 'package:flutter/widgets.dart';
/// Conditionally wrap a subtree with a parent widget without breaking the code tree.
///
/// [condition]: the condition depending on which the subtree [child] is wrapped with the parent.
/// [child]: The subtree that should always be build.
/// [conditionalBuilder]: builds the parent with the subtree [child].
///
/// ___________
/// Usage:
/// ```dart
/// return ConditionalParentWidget(
/// condition: shouldIncludeParent,
/// child: Widget1(
/// child: Widget2(
/// child: Widget3(),
/// ),
/// ),
/// conditionalBuilder: (Widget child) => SomeParentWidget(child: child),
///);
/// ```
///
/// ___________
/// Instead of:
/// ```dart
/// Widget child = Widget1(
/// child: Widget2(
/// child: Widget3(),
/// ),
/// );
///
/// return shouldIncludeParent ? SomeParentWidget(child: child) : child;
/// ```
///
class ConditionalParentWidget extends StatelessWidget {
const ConditionalParentWidget({
Key key,
@required this.condition,
@required this.child,
@required this.conditionalBuilder,
}) : super(key: key);
final Widget child;
final bool condition;
final Widget Function(Widget child) conditionalBuilder;
@override
Widget build(BuildContext context) {
return condition ? this.conditionalBuilder(this.child) : this.child;
}
}
其他回答
编辑:我不再推荐我在下面发布的解决方案，因为我意识到使用这种方法，生成了真实结果的子结果和虚假结果的子结果，但只使用了一个，这不必要地降低了代码的速度。
之前的回答:
在我的应用程序中，我创建了一个WidgetChooser小部件，这样我就可以在没有条件逻辑的小部件之间进行选择:
WidgetChooser(
condition: true,
trueChild: Text('This widget appears if the condition is true.'),
falseChild: Text('This widget appears if the condition is false.'),
);
这是WidgetChooser小部件的源代码:
import 'package:flutter/widgets.dart';
class WidgetChooser extends StatelessWidget {
final bool condition;
final Widget trueChild;
final Widget falseChild;
WidgetChooser({@required this.condition, @required this.trueChild, @required this.falseChild});
@override
Widget build(BuildContext context) {
if (condition) {
return trueChild;
} else {
return falseChild;
}
}
}
我不知道这是否是一个好的做法，但我正在使用:
class StatmentExample extends StatelessWidget {
Widget build(BuildContext context) {
return pageValue==1 ? Page1():pageValue== 2? Page2():pageValue==3 ? Page3():Page4();
}
}
在Dart中，if/else和switch是语句而不是表达式。它们不返回值，所以不能将它们传递给构造函数参数。如果您的构建方法中有很多条件逻辑，那么尝试简化它是一个很好的实践。例如，您可以将自包含逻辑移动到方法，并使用if/else语句来初始化稍后使用的局部变量。
使用方法和if/else
Widget _buildChild() {
if (condition) {
return ...
}
return ...
}
Widget build(BuildContext context) {
return new Container(child: _buildChild());
}
使用if/else
Widget build(BuildContext context) {
Widget child;
if (condition) {
child = ...
} else {
child = ...
}
return new Container(child: child);
}
您可以在以下操作中使用builder: 我已经考虑了一个条件，我们可以得到图像url为空，因此，如果为空，我显示一个缩小大小的盒子，因为它没有一个完全无效的小部件的属性。
Builder(builder: (BuildContext context) {
if (iconPath != null) {
return ImageIcon(
AssetImage(iconPath!),
color: AppColors.kPrimaryColor,
);
} else {
return SizedBox.shrink();
}
})
除了三元操作符，如果需要在条件语句之前执行操作，还可以使用Builder小部件。
Builder(builder: (context) {
/// some operation here ...
if(someCondition) {
return Text('A');
}
else {
return Text('B');
}
})
