Flutter dio,如何将 onSendProgress 数据传递回小部件?

huangapple go评论58阅读模式
英文:

Flutter dio, how to pass onSendProgress data back to widget?

问题

在小部件之外的函数中,我有一个 dio 发送请求如下:

final response = await dio.post(
  url.toString(), 
  data: formData,
  options: Options(
    headers: headers_form,
  ),
  onSendProgress: (int sent, int total) {
    print(sent);
  },
);

我如何将这个 onSendProgress 数据传递回我的小部件以进行显示?涉及的小部件是一个 AlertDialog 小部件,显示要上传的图像。当我按下上传按钮时,我希望有一个进度指示器,由 onSendProgress dio 回调驱动。

return StatefulBuilder(
  builder: (context, setState)  {
    return AlertDialog(
      title: Text('Confirm File Upload'),
      content: Container(
        child: Column(
          children: [
            Text(progress.value.toString()) // 这里是我想要更新进度条数据的地方
          ],
        ),
      ),
      actions: [
        TextButton(
          onPressed: () =>
              Navigator.pop(context, false),
          child: Text('Cancel'),
        ),
        FFButtonWidget(
          onPressed: () async {
            await TheClass().uploadFile(widget.folderID, imagePath); // 这里是当按下确定按钮时调用上传文件函数的地方
            Navigator.pop(context, true);
          },
        ),
      ],
    );
  },
);
英文:

In a function outside of the widget, I have a dio post request as follows:

final response = await dio.post(
  url.toString(), 
  data: formData,
  options: Options(
    headers: headers_form,
  ),
  onSendProgress: (int sent, int total) {
    print(sent);
  },
);

How do I pass this onSendProgress data back to my widget to display? The widget in question is an AlertDialog widget that shows the image to be uploaded. When I press the upload button, I want a progress indicator that is driven by the onSendProgress dio callback.

return StatefulBuilder(
  builder: (context, setState)  {
    return AlertDialog(
      title: Text('Confirm File Upload'),
      content: Container(
        child: Column(
          children: [
            Text(progress.value.toString()) // This is where I want to update the progress bar data
          ],
        ),
      ),
      actions: [
        TextButton(
          onPressed: () =>
              Navigator.pop(context,false),
          child: Text('Cancel'),
        ),
        FFButtonWidget(
          onPressed: () async {
            await TheClass().uploadFile(widget.folderID, imagePath); //This is where I call the upload file function when OK button is pressed
            Navigator.pop(context,true);
          },

答案1

得分: 0

在小部件内创建一个函数。例如:

void _onUploadProgress(int sent, int total) {
  // 在这里执行一些操作
}

然后,在您的类中,在 uploadFile 方法中添加一个命名参数,像这样:

Future<void> uploadFile(
  String folderId,
  String imagePath,
  // 添加这一行:
  {Function(int, int)? onUploadProgress}) {
 await dio.post(
   ,
   onSendProgress: (int sent, int total) {
     onUploadProgress?.call(sent, total);
   }
 );
}

现在,当您调用 uploadFile 时,将 _onUploadProgress 方法作为 onUploadProgres 参数传递:

await uploadFile(
   ,
   onUploadProgress: _onUploadProgress,
);
英文:

Create a function inside the widget. For example:

void _onUploadProgress(int sent, int total) {
  // do something here
}

Then, inside your class in the uploadFile method add a named parameter, like this:

Future&lt;void&gt; uploadFile(
  String folderId,
  String imagePath,
  // add this line:
  {Function(int, int)? onUploadProgress}) {
 await dio.post(
   ,
   onSendProgress: (int sent, int total) {
     onUploadProgress?.call(sent, total);
   }
 );
}

Now when you call uploadFile pass the _onUploadProgress method as the onUploadProgres parameter:

await uploadFile(
   ,
   onUploadProgress: _onUploadProgress,
);

huangapple
  • 本文由 发表于 2023年7月3日 06:18:12
  • 转载请务必保留本文链接:https://go.coder-hub.com/76600996.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定