首页 > 解决方案 > 预期类型为“地图”的值,动态>',但得到了“列表”类型之一' 在发出 api post 请求时

问题描述

我正在构建一个颤振网页,其中包含从 api 检索的数据,几乎一切正常,但我遇到了这个问题。该api只接受一个参数'{“url”:“”}',并且我的代码中的所有内容都有效,因为如果我尝试在控制台中打印结果,它就可以工作。我唯一的问题是在屏幕上显示数据时,即使我向他传递了他期望的类型,颤振也给了我这个错误。

这是我的代码:

import 'dart:async';
import 'dart:convert';

import 'package:flutter/material.dart';
import 'package:http/http.dart';

Future<Album> fetchAlbum() async {
  final headers = {"Content-type": "text/plain"};
  final json = '{"url": ""}';
  final response = await post(
      Uri.parse('myapikey'),
      headers: headers,
      body: json);

  if (response.statusCode == 200) {
    // If the server did return a 200 OK response,
    // then parse the JSON.
    print(response.body);
    return Album.fromJson(jsonDecode(response.body));
  } else {
    // If the server did not return a 200 OK response,
    // then throw an exception.
    throw Exception('Failed to load album');
  }
}

class Album {
  final String url;

  Album({
    required this.url,
  });

  factory Album.fromJson(Map<List<dynamic>, dynamic> json) {
    return Album(url: json['']);
  }
}

void main() => runApp(const MyApp());

class MyApp extends StatefulWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  late Future<Album> futureAlbum;

  @override
  void initState() {
    super.initState();
    futureAlbum = fetchAlbum();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Test',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          title: const Text('Test'),
        ),
        body: Center(
          child: FutureBuilder<Album>(
            future: futureAlbum,
            builder: (context, snapshot) {
              if (snapshot.hasData) {
                return Text(snapshot.data!.url);
              } else if (snapshot.hasError) {
                return Text('${snapshot.error}');
              }

              // By default, show a loading spinner.
              return const CircularProgressIndicator();
            },
          ),
        ),
      ),
    );
  }
}

有人能帮我吗?

标签: flutterapidartflutter-web

解决方案


Album 类中的工厂需要一个Map ,其键类型为 List值类型为 dynamic ,但您的json主体是{"url": ""},在使用 解码后jsonDecode(response.body),它的类型为Map<String, String>,这与不同。Map<List<dynamic>, dynamic>

class Album {
  final String url;

  Album({
    required this.url,
  });
  
  // This factory causes the error
  factory Album.fromJson(Map<List<dynamic>, dynamic> json) {
    return Album(url: json['']);
  }
}

此外,当您想检索 url 的值时,您必须编写json["url"]而不是json[''],因为它是in"url"的键。""'{"url": ""}'

解决方案:因此您应该更改工厂以接受类型参数Map<dynamic, dynamic>,并将用于检索的键""更改json['']json["url"]

  factory Album.fromJson(Map<dynamic, dynamic> json) {
    return Album(url: json["url"]);
  }

另请参阅此工作 DartPad 示例:

import 'dart:async';
import 'dart:convert';

import 'package:http/http.dart';

Future<Album> fetchAlbum() async {
  final headers = {"Content-type": "text/plain"};
  final json = '{"url": ""}';
  final response = Response(
    json,
    200,
    request: Request(
      "post",
      Uri.parse('myapikey'),
    ),
    headers: headers,
  );

  if (response.statusCode == 200) {
    // If the server did return a 200 OK response,
    // then parse the JSON.
    print(response.body);
    return Album.fromJson(jsonDecode(response.body));
  } else {
    // If the server did not return a 200 OK response,
    // then throw an exception.
    throw Exception('Failed to load album');
  }
}

class Album {
  final String url;

  Album({
    required this.url,
  });

  factory Album.fromJson(Map<dynamic, dynamic> json) {
    return Album(url: json["url"]);
  }
}

void main() {
  fetchAlbum();
}

推荐阅读