颤振条件渲染。不工作？答案

【问题标题】：flutter conditional rendering. Not working?颤振条件渲染。不工作？
【发布时间】：2020-07-17 16:44:16
【问题描述】：

颤振条件渲染。不工作？。我确实尝试了很多方法，但我找不到任何解决方案。当data[index].status 不为空时，我想渲染一个小部件。我的代码对我不起作用。

现在我遇到了其他问题元素类型“Set”不能分配给列表类型“Widget”。

@override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Color(0xFFecf0f1),
      appBar: AppBar(
        actions: <Widget>[],
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            child: ListView.builder(
              padding: EdgeInsets.all(10),
              itemCount: data.length,
              itemBuilder: (BuildContext context, int index) {
                return Card(
                  margin: EdgeInsets.all(10),
                  child: Padding(
                    padding: EdgeInsets.all(5),
                    child: Container(
                      child: Column(
                        children: <Widget>[
                          Container(
                            child: Row(
                              children: <Widget>[
                                Container(
                                  child: Text(data[index].airline,
                                      style: TextStyle(
                                        fontFamily: '',
                                        fontSize: 20,
                                        color: Colors.black,
                                        fontWeight: FontWeight.w300,
                                      )),
                                ),
                                if (data[index].status == null)
                                  {
                                    Container(
                                      child: Text('somthing'),
                                    )
                                  }
                                else
                                  {
                                    Container(
                                      decoration: BoxDecoration(
                                          color: Colors.red[700],
                                          borderRadius:
                                              BorderRadius.circular(20)),
                                      padding: EdgeInsets.symmetric(
                                          vertical: 6, horizontal: 8),
                                      child: Text(
                                        data[index].status,
                                        style: TextStyle(
                                            fontSize: 15,
                                            color: Colors.white,
                                            fontWeight: FontWeight.normal,
                                            fontFamily: 'Raleway'),
                                      ),
                                    ),
                                  }
                              ],
                            ),
                          ),
                        ],
                      ),
                    ),
                  ),
                );
              },
            ),
          ),
        ],
      ),
    );
  }
}

【问题讨论】：

标签： flutter dart

【解决方案1】：

您正在将 data[index].status 值设置为 null。

您使用的是=，这意味着分配一个值而不是==，这是相等的检查

你的代码应该是

Row(

    children:<widget>[
      if (data[index].status == null) // note the ==
                         {
                              Container(
                                  child: Text('somthing'),
                                        )
                                      }
                                    else
                                      {
                                        Container(
                                          decoration: BoxDecoration(
                                              color: Colors.red[700],
                                              borderRadius:
                                                  BorderRadius.circular(20)),
                                          padding: EdgeInsets.symmetric(
                                              vertical: 6, horizontal: 8),
                                          child: Text(
                                            data[index].status,
                                            style: TextStyle(
                                                fontSize: 15,
                                                color: Colors.white,
                                                fontWeight: FontWeight.normal,
                                                fontFamily: 'Raleway'),
                                          ),
                                       ),
                                      }

    ]
    )

参考文献

Dart: Operators - Nice to read

【讨论】：

现在显示的问题是：元素类型“Set”不能分配给列表类型“Widget”。
这是一个不同的问题，请发布更多代码以最小化重新创建它
@Leewan 这可能会有所帮助stackoverflow.com/questions/50392607/…
阅读this post和this answer关于if内部集合表达式。

【解决方案2】：

collection if 将 if/else 子句之后的花括号解释为不是代码块，而是 set 文字：

这段代码编译正常：

class GoodWidget extends StatelessWidget {
  final bye = false;
  @override
  Widget build(BuildContext context) {
    return Column(children: [
      if (bye) Text('Goodbye') else Text('Hello'),
      Text('World!')
    ]);
  }
}

并且此代码会产生错误 The element type 'Set<Container>' can't be assigned to the list type 'Widget'

class BadWidget extends StatelessWidget {
  final bye = false;
  @override
  Widget build(BuildContext context) {
    return Column(children: [
      if (bye) {Text('Goodbye')} else {Text('Hello')},
      Text('World!')
    ]);
  }
}

这种情况下不允许使用大括号。

【讨论】：