Question

我正在尝试显示进度栏，直到获取数据为止。在初始化状态下，我调用了api。如图所示，它显示错误，然后显示布局而不显示进度条。我是新来的人，无法解决这个问题。

我实现了以下内容：

In [341]: np.exp(x)                                                                            
Out[341]: array([1.        , 2.71828183, 7.3890561 ])

GetDetails方法

     @override
  void initState() {
    super.initState();
    getDetails();
  }

构建方法：

void getDetails() async {
setState(() {
  _isLoading = true;
});

MenuDetailsResponse moreResponse = await getMenuDetails(widget.id);

if (moreResponse != null && moreResponse.data != null) {
  setState(() {

    details = moreResponse.data;
    if (details.detail.maxQty != null) {
      maxQtyController =
          new TextEditingController(text: details.detail.maxQty.toString());
    } else {
      maxQtyController = new TextEditingController();
    }
    print(details);
    _isLoading = false;
  });
} else if (moreResponse != null) {
  setState(() {
    _isLoading = false;
  });
  showAlerts(context, "Sorry!!", moreResponse.message, AlertType.error);
} else {
  setState(() {
    _isLoading = false;
  });
  showAlerts(context, "Sorry!!",
      "Something went wrong, Please try again later!!", AlertType.error);
}
}

BuildLayout小部件

 @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        iconTheme: IconThemeData(color: Theme.of(context).primaryColor),
        title: Text(
          "Menu Details",
          style: TextStyle(color: Theme.of(context).primaryColor),
        ),
      ),
      body: Stack(
        children: <Widget>[
          Opacity(
            opacity: _isLoading
                ? 0.3
                : 1, // You can reduce this when loading to give different effect
            child: AbsorbPointer(
              absorbing: _isLoading,
              child: _buildLayout(),
            ),
          ),
          Opacity(
              opacity: _isLoading ? 1.0 : 0,
              child: Center(
                child: CircularProgressIndicator(
                  backgroundColor: Theme.of(context).primaryColor,
                ),
              )),
        ],
      ),
    );
  }

小部件topItems

    Widget _buildLayout() {
        return Container(
          margin: EdgeInsets.all(10),
          child: Wrap(
            children: <Widget>[
              Column(
                children: <Widget>[
                  SizedBox(height: 20),
                  Text(
                    "Enter max quantity for today",
                    style: TextStyle(color: Theme.of(context).primaryColor),
                  ),
                  SizedBox(height: 20),
                  _buildTopItems(),           
                ],
              )
            ],
          ),
        );
      }

Answer 1

在我看来details是一个类字段，当第一次调用build时将是null。

发生这种情况是因为您正在details上填充initState，但是getDetails是异步调用，因此initState将执行并将getDetails排入队列，以便以后使用，因为它是Future，所以它会在将来而不是现在执行。目前，Flutter转到了build，在那里访问了details的{{1}}。

如果您的null方法内部需要来自Future的数据，请使用build。

Answer 2

我通过如下更改buildmethod来解决了这个问题：

    @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.white,
          iconTheme: IconThemeData(color: Theme.of(context).primaryColor),
          title: Text(
            "Menu Details",
            style: TextStyle(color: Theme.of(context).primaryColor),
          ),
        ),
        body: _isLoading
            ? Center(
                child: CircularProgressIndicator(
                  backgroundColor: Theme.of(context).primaryColor,
                ),
              )
            : _buildLayout()
        );
  }

该吸气剂被调用为null

2 个答案: