颤振在不等待代码执行的情况下重建小部件

Question

我有一个上传图像到服务器的功能。然而，小部件在上传图像时开始重建，并且在上传图像后不执行代码。

InkWell(
  child: Icon(
    Icons.camera,
    size: 50,
    color: Colors.red[400],
  ),
  onTap: () {
    _imageFile =
        _picker.getImage(source: ImageSource.camera);
    _imageFile.then((file) async {
      if (file != null) {
        fileName = file.path.toString();
        var res = await Auth.uploadImage(file);
        print("Response for image upload is : ");
        print(res);
        await setUserData();
      }
    });
  },
)

这是控制台上打印语句的输出

I/flutter (10171): Calling build Method
I/Timeline(10171): Timeline: Activity_launch_request time:68831133
I/flutter (10171): Uploading image to server
I/flutter (10171): Calling build Method
I/flutter (10171): Image uploaded successfully

如上所述，没有执行任何其他代码，小部件已经重建了自身。我可能做错了什么？

Answer 1

匿名用户

这是因为当您使用_imageFile=_picker.getImage（来源：ImageSource.camera）；_imageFile结果将在未来出现，您的下一段代码将被执行。

您可以使用await解决此问题：

 onTap: () async {
    _imageFile =
        await _picker.getImage(source: ImageSource.camera);
    if (_imageFile != null) {
        fileName = file.path.toString();
        var res = await Auth.uploadImage(file);
        print("Response for image upload is : ");
        print(res);
        await setUserData();
    }
  },

或者继续使用，然后稍作更改：

  onTap: () {
    _picker.getImage(source: ImageSource.camera)
           .then((file) async {
             if (file != null) {
               fileName = file.path.toString();
               var res = await Auth.uploadImage(file);
               print("Response for image upload is : ");
               print(res);
               await setUserData();
           }
        });
  },

请参阅关于wait的说明

Answer 2

\u imageFile=\u picker。getImage（来源：ImageSource.camera）这是不对的，getImage是一个异步函数，所以需要等待它完成。

执行此操作-_imageFile=等待_picker.get图像（来源：ImageSource.camera）；

如果你想使用，那么像这样做，\u picker。getImage（来源：ImageSource.camera）。然后（（图像）。。。你的代码…）