Flutter Dio3.x版本上传图片提示 type '_File' is not a subtype of type 'String'

发布于 1周前 作者 phonegap100 来自 分享

Flutter Dio 3.x版本上传图片提示 type ‘_File’ is not a subtype of type 'String’如何解决呢?

其实主要原因是:dio 3.0.0为了支持Flutter Web,需要进行较大重构,因此无法直接兼容2.1.x

解决方案如下:

import 'dart:io';

import 'package:flutter/material.dart';

import 'package:image_picker/image_picker.dart';

import 'package:dio/dio.dart';

class ImagePickerPage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return _ImagePickerState();
  }
}

class _ImagePickerState extends State<ImagePickerPage> {
  File _image;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text("ImagePicker"),
        ),
        body: SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              RaisedButton(
                onPressed: _takePhoto,
                child: Text("拍照"),
              ),
              RaisedButton(
                onPressed: _openGallery,
                child: Text("选择图库照片"),
              ),
              _buildImage()
            ],
          ),
        ));
  }

  /*拍照*/
  _takePhoto() async {
    var image =
        await ImagePicker.pickImage(source: ImageSource.camera, maxWidth: 400);

    setState(() {
      this._image = image;
    });

    this._uploadImage(image);
  }

  /*相册*/
  _openGallery() async {
    var image =
        await ImagePicker.pickImage(source: ImageSource.gallery, maxWidth: 400);

    setState(() {
      this._image = image;
    });
  }

  //定义一个组件显示图片
  Widget _buildImage() {
    if (this._image == null) {
      return Text("请选择图片...");
    }
    return Image.file(this._image);
  }

  //上传图片
  _uploadImage(File _imageDir) async {
    
    //注意:dio3.x版本为了兼容web做了一些修改,上传图片的时候需要把File类型转换成String类型
   
    var fileDir=_imageDir.path;
       

    FormData formData = FormData.fromMap({
      "name": "zhangsna 6666666666",
      "age": 20,
      "sex": "男",    
      "file":  await MultipartFile.fromFile(fileDir, filename: "xxx.jpg")     
    });

    var response =
        await Dio().post("http://jd.itying.com/imgupload", data: formData);

    print(response);
  }
}

1 回复

可以用 谢谢

回到顶部