颤振| Dart 有没有更优雅的方式来编写这段代码？

编程问答 2022-05-17

问题描述

  var showtextA = true;
  @override
  Widget build(BuildContext context) {
    return Row(
      children: (showtextA)
          ? [
              Text("A"),Text("B"),Text("C"),]
          : [
              Text("B"),],);
  }
  1. 或
  var havePadding = true;
  @override
  Widget build(BuildContext context) {
    return (havePadding) ?
    Container(
      padding: EdgeInsets.all(10.0),child:...,) : Container(
      child:...,);
  }

通过上面的代码，不知道你能不能理解我的意思？ 我记得 Dart 为 Flutter 提供了某种语法糖，但是我忘了，我一直在寻找它，但我不知道如何描述它。

解决方法

基于代码给出它最好这样做。最好最小化小部件重建。如果只有少数状态小部件要更改，则只需管理该小部件。

  var showTextA = true;
  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        (showTextA) ? Text("A") : SizedBox(),Text("B"),Text("C"),],);
  }

  var havePadding = true;
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(havePadding ? 10.0:  0 ),child: ....,)
,

您可以创建一个看起来很棒的方法：

List<Widget> getTexts(bool showTextA) {
    if (showTextA) {
        return [Text("A"),Text("C")];
    }
        else {
            return [Text("B"),Text("C")];
        }
}

然后在 build 方法中：

Widget build(BuildContext context) {
    return Row(
        children: getTexts(showTextA)
    );
  }
,

你可以试试

var showTextA = true;
@override
Widget build(BuildContext context) {
    return Row(
      children:[
            if (showTextA) Text("A"),);
}

或

var havePadding = true;
@override
Widget build(BuildContext context) {
  return Container(
      padding: havePadding ? EdgeInsets.all(10.0) : null,child: Text('sdfsdf'),);
}
,

对于第一个示例，由于您的条件中只有 1 个小部件，因此只需将 ? : 替换为无括号的 if

  var showTextA = true;
  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
              if(showTextA) Text("A"),]
    );
  }

至于你的第二个例子，你可以做

  var havePadding = true;
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: havePadding ? EdgeInsets.all(10.0) : null //or EdgeInsets.zero,child:...,)
  }

这肯定会减少几行代码并使其更具可读性。

dart