从导入的数据创建表

Question

我正在尝试从导入的 CSV 文件创建一个表，以便以后调用该表来获取数据。我以this tutorial 为起点。

到目前为止，我已经设法创建了表格，但它只有在您按下按钮时才会生成。我想做的是在应用程序启动后立即加载表格。

我的代码与教程中的代码几乎相同，但不管怎样，这里是：

import 'package:flutter/material.dart';
import 'package:csv/csv.dart';
import 'package:flutter/services.dart' show rootBundle;


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

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

class _TableLayoutState extends State<TableLayout> {
  List<List<dynamic>> data = [];
  loadAsset() async {
    final myData = await rootBundle.loadString("assets/routes.csv");
    List<List<dynamic>> csvTable = const CsvToListConverter().convert(myData);
    print(csvTable);
    data = csvTable;
    setState(() {

    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      floatingActionButton: FloatingActionButton(
          child: const Icon(Icons.refresh),
          onPressed: () async {
            await loadAsset();
            //print(data);
          }),
      appBar: AppBar(
        title: const Text("Bus Routes"),
      ),

      body: SingleChildScrollView(
        child: Table(
          border: TableBorder.all(width: 1.0),
          children: data.map((item) {
            return TableRow(
                children: item.map((row) {
                  return Container(
                    color: Colors.blueGrey,
                    child: Padding(
                      padding: const EdgeInsets.all(1.0),
                      child: Text(
                        row.toString(),
                        style: const TextStyle(fontSize: 20.0),
                      ),
                    ),
                  );
                }).toList());
          }).toList(),
        ),
      ),
    );
  }
}

使用此代码，将生成以下屏幕（按下按钮后）：

我不担心表格的外观，因为用户最终不会真正看到它。相反，它将用于检索数据以在我的应用程序的其他屏幕中使用。我知道它只在按下按钮时生成，因为这条线：

onPressed: () async {
        await loadAsset();

我不确定如何在应用启动时而不是在按下按钮时运行它。

Answer 1

解决方案：

感谢rosh-dev 的评论，我能够创建一个initSate 来解决我的问题。

本教程也有帮助：Flutter Tutorial for Beginners #25 - Asynchronous Code

新代码如下所示：

import 'package:flutter/material.dart';
import 'package:csv/csv.dart';
import 'package:flutter/services.dart' show rootBundle;

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

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

class _TableLayoutState extends State<TableLayout> {


    List<List<dynamic>> data = [];

    void loadAsset() async {
      final myData = await rootBundle.loadString("assets/routes.csv");
      List<List<dynamic>> csvTable = const CsvToListConverter().convert(myData);
      print(csvTable);
      data = csvTable;
      setState(() {

      });
    }


  @override

  void initState() {
    super.initState();
    loadAsset();
  }

  Widget build(BuildContext context) {
    return Scaffold(
      // floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
      // floatingActionButton: FloatingActionButton(
      //     child: const Icon(Icons.refresh),
      //     onPressed: () async {
      //       await loadAsset();
      //     }),
      appBar: AppBar(
        title: const Text("Bus Routes"),
      ),

      body: SingleChildScrollView(
        child: Table(
          border: TableBorder.all(width: 1.0),
          children: data.map((item) {
            return TableRow(
                children: item.map((row) {
                  return Container(
                    color: Colors.blueGrey,
                    child: Padding(
                      padding: const EdgeInsets.all(1.0),
                      child: Text(
                        row.toString(),
                        style: const TextStyle(fontSize: 20.0),
                      ),
                    ),
                  );
                }).toList());
          }).toList(),
        ),
      ),
    );
  }
}

谢谢