如何更高效地编写这个 Flutter 代码？答案

【问题标题】：How to write this Flutter code more efficiently?如何更高效地编写这个 Flutter 代码？
【发布时间】：2020-01-18 07:41:47
【问题描述】：

正如您在第一部分中看到的，我正在检查某个值是否包含在来自 Firestore 的文档中并返回一个布尔值。现在我在构建中调用该函数，并根据该返回值更改芯片颜色（第二部分）。

现在的问题可能是因为我在构建函数中调用它，所以它在构建过程中被连续调用，这让我在 Firestore 中读取了大量数据，或者该函数效率低下。我怎样才能更有效地写这个？

checkAtt(String name, id , date) async{
   var ref = _db.collection('subjects').document(id).collection('Att').document(date);
   var docref = await ref.get();
      return docref.data.containsKey(name)
        ?true
        :false;
  }

 class PresentChip extends StatefulWidget {
  final candidate;
  PresentChip(
    this.candidate, {
    Key key,
  }) : super(key: key);
  @override
  _PresentChipState createState() => _PresentChipState();
}

class _PresentChipState extends State<PresentChip> {
  var isSelected = false;
  var c = false;
  @override
  Widget build(BuildContext context) {
    final SelectSub selectSub = Provider.of<SelectSub>(context);
    final Date date = Provider.of<Date>(context);

  db.checkAtt(widget.candidate, selectSub.selectsub, date.datenew).then((result){
    print(result);
    setState(() {
     c = result; 
    });
  }); 

       return Container(
      child: ChoiceChip(
        label: Text('Present'),
        selected: isSelected,
        onSelected: (selected) {
          db.gibAtt(
              widget.candidate, selectSub.selectsub, date.datenew.toString());
          setState(() {
            isSelected = selected;
          });
        },
        backgroundColor: !c ?Colors.red :Colors.green ,
        selectedColor: !c ?Colors.red :Colors.green ,
    ));
  }
}

【问题讨论】：

您应该在问题中发布图片，而不是在问题的 cmets 中
@Durdu 这样吗？
你应该直接添加代码，而不是图像。
@Durdu 好的....已编辑
我已经编辑了这个问题。以前它被表述为“任何人都愿意做一些免费的工作”，我现在已经改变了它，所以重点是你，这个帖子的作者，如何能够达到预期的结果。差异可能是微妙的，但它可以解释四次投反对票。

标签： flutter dart google-cloud-firestore

【解决方案1】：

假设您只想从 firestore 读取一次，您需要一个 FutureBuilder。

return Container(
  child: FutureBuilder(
    future: db.checkAtt(widget.candidate, selectSub.selectsub, date.datenew),
    builder: (context, snapshot) {
      if(snapshot.hasData)
      return ChoiceChip(
        ...
        backgroundColor: !snapshot.data ?Colors.red :Colors.green,
        selectedColor: !snapshot.data ?Colors.red :Colors.green,
      );

      //Return another widget if the future has no data
      return Text('Future has no data');
    }
  )
);

如果您需要您的 UI 对来自 Firestore 的更改做出反应，请使用 StreamBuilder。

您可以从构建方法中删除以下块：

db.checkAtt(widget.candidate, selectSub.selectsub, date.datenew).then((result){
  print(result);
  setState(() {
   c = result; 
  });
});

【讨论】：