0

我想在数据表中.map输出一些错误。Data Row

在此处输入图像描述

我在以前的情况下已经实现了这一点，并且我了解如何做到这一点，但在这种情况下，情况似乎有所不同，并且似乎了解如何定义方法“map”。我想实现如下图所示的内容，其中列标题是静态的，并且行被映射出来。

在此处输入图像描述

这是代码：

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:providerrest/helpers/apihelper.dart';
import 'package:providerrest/models/post.dart';
import 'package:providerrest/provider/homepageprovider.dart';

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  GlobalKey<ScaffoldState> _globalKey = GlobalKey();

  _getPosts() async {
    var provider = Provider.of<HomePageProvider>(context, listen: false);

    var postsResponse = await getPosts();
    if (postsResponse.isSuccessful) {
      provider.setPostsList(postsResponse.data, notify: false);
    } else {
      provider.mergePostsList(postsResponse.data, notify: false);
    }

    provider.setIsHomePageProcessing(false);
  }

  @override
  void initState() {
    super.initState();
    _getPosts();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _globalKey,
      appBar: AppBar(
        title: Text('Provider REST'),
      ),
      body: Consumer<HomePageProvider>(
        builder: (_, provider, __) {
          return ListView.builder(
            itemBuilder: (_, index) {
              Post post = provider.getPostByIndex(index);
              return DataTable(
                columnSpacing: 50,
                columns: <DataColumn>[
                  DataColumn(
                    label: Text(
                      'Friendly Name',
                      style: TextStyle(fontStyle: FontStyle.italic),
                    ),
                  ),
                  DataColumn(
                    label: Text(
                      'Licence Plate',
                      style: TextStyle(fontStyle: FontStyle.italic),
                    ),
                  ),
                  DataColumn(
                    label: Text(
                      'Delete',
                      style: TextStyle(fontStyle: FontStyle.italic),
                    ),
                  ),
                ],
                rows: post.map<DataRow>((e) {
                  return DataRow(
                    cells: <DataCell>[
                      DataCell(
                        Text('${e.friendlyName}'),
                      ),
                      DataCell(
                        Text('${e.licencePlate}'),
                      ),
                      DataCell(
                        Icon(Icons.delete),
                      ),
                    ],
                  );
                }).toList(),
              );
            },
            itemCount: provider.postsListLength,
          );
        },
      ),
    );
  }
}

后模型

class Post {
  int capacity;
  String id;
  String friendlyName;
  String licencePlate;

  Post({this.capacity, this.id, this.friendlyName, this.licencePlate});

  Post.fromJson(Map<String, dynamic> json) {
    capacity = json['capacity'];
    id = json['id'];
    friendlyName = json['friendlyName'];
    licencePlate = json['licencePlate'];
  }

  Map<String, dynamic> toJson() {
    final Map<String, dynamic> data = new Map<String, dynamic>();
    data['capacity'] = this.capacity;
    data['id'] = this.id;
    data['friendlyName'] = this.friendlyName;
    data['licencePlate'] = this.licencePlate;
    return data;
  }
}

API 调用

import 'dart:convert';

import 'package:http/http.dart';
import 'package:providerrest/models/httpresponse.dart';
import 'package:providerrest/models/post.dart';

Future<HTTPResponse<List<Post>>> getPosts() async {
  final response =
      await get('https://run.mocky.io/v3/d7a00528-176c-402f-850e-76567de3c68d');
  if (response.statusCode == 200) {
    var body = jsonDecode(response.body)['data'];
    List<Post> posts = [];
    body.forEach((e) {
      Post post = Post.fromJson(e);
      posts.add(post);
    });
    return HTTPResponse<List<Post>>(
      true,
      posts,
      message: 'Request Successful',
      statusCode: response.statusCode,
    );
  } else {
    return HTTPResponse<List<Post>>(
      false,
      null,
      message:
          'Invalid data received from the server! Please try again in a moment.',
      statusCode: response.statusCode,
    );
  }
}

和提供者：

import 'package:flutter/foundation.dart';
import 'package:providerrest/models/post.dart';

class HomePageProvider extends ChangeNotifier {
  bool _isHomePageProcessing = true;
  List<Post> _postsList = [];

  bool get isHomePageProcessing => _isHomePageProcessing;

  setIsHomePageProcessing(bool value) {
    _isHomePageProcessing = value;
    notifyListeners();
  }

  List<Post> get postsList => _postsList;

  setPostsList(List<Post> list, {bool notify = true}) {
    _postsList = list;
    if (notify) notifyListeners();
  }

  mergePostsList(List<Post> list, {bool notify = true}) {
    _postsList.addAll(list);
    if (notify) notifyListeners();
  }

  deletePost(Post list) {
    _postsList.remove(list);

    notifyListeners();
  }

  addPost(Post post, {bool notify = true}) {
    _postsList.add(post);
    if (notify) notifyListeners();
  }

  Post getPostByIndex(int index) => _postsList[index];

  int get postsListLength => _postsList.length;
}

我以为我通过Map toJson()在 Post 模型中创建一个方法来实现这一点，但似乎我错了。

预先感谢您的帮助！

4

1 回答 1

1

我怀疑你期待下面的代码。

您可以使用 List.generate 来填充数据行列表，而不是使用 ListView.builder。

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _globalKey,
      appBar: AppBar(
        title: Text('Provider REST'),
      ),
      body: Consumer<HomePageProvider>(
        builder: (_, provider, __) {
          return DataTable(
            columnSpacing: 50,
            columns: <DataColumn>[
              DataColumn(
                label: Text(
                  'Friendly Name',
                  style: TextStyle(fontStyle: FontStyle.italic),
                ),
              ),
              DataColumn(
                label: Text(
                  'Licence Plate',
                  style: TextStyle(fontStyle: FontStyle.italic),
                ),
              ),
              DataColumn(
                label: Text(
                  'Delete',
                  style: TextStyle(fontStyle: FontStyle.italic),
                ),
              ),
            ],
            rows: List.generate(provider._postsList.length, (index) {
              Post post = provider.getPostByIndex(index);
              return DataRow(
                cells: <DataCell>[
                  DataCell(
                    Text('${post.friendlyName}'),
                  ),
                  DataCell(
                    Text('${post.licencePlate}'),
                  ),
                  DataCell(
                    Icon(Icons.delete),
                  ),
                ],
              );
            }),
          );
        },
      ),
    );
  }

我希望它能帮助你实现你的要求。

于 2021-02-05T18:02:20.140 回答