Question

我在应用程序中创建了一个表单，但是image字段没有将任何图像解析到服务器。我使用图库中的图片选择器。这是我从图库获取的图像代码：

 Future getImageFromGallery() async {
    var image = await ImagePicker.pickImage(source: ImageSource.gallery);
    setState(() {
      _image = image;
    });
  }

这是我的身体应用代码，其中包含来自画廊的文本字段和图像选择器：

Padding(
                  padding: const EdgeInsets.only(top: 8.0),
                  child: new TextFormField(
                    maxLines: 3,
                    decoration: new InputDecoration(
                        labelText: "Keterangan"),
                    onSaved: (String val) => description = val,
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(15.0),
                  child: SizedBox(
                    width: 100.0,
                    height: 100.0,
                    child: RaisedButton(
                      child: _image == null
                          ? Icon(Icons.add_a_photo)
                          : Image.file(_image),
                      onPressed: () {
                        this.getImageFromGallery();
                      },
                    ),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.only(top: 40.0),
                  child: RaisedButton(
                    child: Text("Submit"),
                    color: Colors.blue,
                    onPressed: () {
                      newPost();
                    },

这是我的newPost方法：

void newPost() async {
    Map data = {
      "destination": destination,
      "start": start,
      "finish": finish,
      "person": person,
      "route": route,
      "descrption": description,
      "image": image
    };

    var body = json.encode(data);

    String token = await getToken();

    var response = await http.post('https://api-wisapedia.herokuapp.com/posts/',
        headers: {HttpHeaders.authorizationHeader: 'Bearer $token'},
        body: body);

    _newPostResponse =
        NewPostResponse.fromJson(json.decode(response.body.toString()));

    if (token != null) {
      if (destination.isEmpty ||
          start.isEmpty ||
          finish.isEmpty ||
          person.isEmpty ||
          route.isEmpty ||
          description.isEmpty ||
          image.isEmpty) {
        showDialog(
            builder: (context) => AlertDialog(
                  content: Text('Please fill the form'),
                  actions: <Widget>[
                    FlatButton(
                      onPressed: () {
                        Navigator.pop(context);
                      },
                      child: Text('OK'),
                    )
                  ],
                ),
            context: context);
      } else {
        _formkey.currentState.save();
        Navigator.push(
            context, MaterialPageRoute(builder: (context) => MainScreen()));
      }
    } else {
      showDialog(
          builder: (context) => AlertDialog(
                content: Text('You need to authenticate'),
                actions: <Widget>[
                  FlatButton(
                    onPressed: () {
                      Navigator.pop(context);
                    },
                    child: Text('$token'),
                  )
                ],
              ),
          context: context);
    }
  }

在文本字段中有onSaved方法可以使该字段的值可以通过API上传，但没有用于图像的onSaved方法。我很困惑: Image.file(_image)与onSaved的角色是否相同？然后，当我运行此代码时，我不知道为什么，但是图像未上传。我该如何解决这个问题？

Answer 1

我认为您应该等待函数，因为它正在返回Future。像这样：

onPressed: () async {
  await this.getImageFromGallery();
},

我无法将图像文件上传到服务器（Flutter-API）

1 个答案: