Dart 将listView传递到另一个屏幕

我需要帮助将列表视图传递到另一个屏幕

我不熟悉颤振和飞镖，但一般都熟悉编程。我知道了如何通过api调用创建列表。但是，我当前的代码，当我按下一个按钮时，它会显示在我当前所在的屏幕上。我想将它传递到另一个屏幕，以在列表中显示（主页上将有文本字段，这些字段将更改url以从中获取数据）。我想我试图做的是，当用户按下一个按钮时，它调用fetchdata，构建我的列表并将其显示在不同的屏幕上

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

void main(){
  runApp(
      MaterialApp(
      home: MyApp(),
  ),
  );
}
class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeScreen();
  }
}

//List is here, had to make global so I could access in 2 widgets
List<TrailModel> trails=[];
class HomeScreen extends State<MyApp> {

  Future<List<TrailModel>> fetchData() async {
    var response = await get('https://www.hikingproject.com/data/get-trails?lat=40.0274&lon=-105.2519&maxDistance=10&key=200419778-6a46042e219d019001dd83b13d58aa59');
    final trailModels = List<TrailModel>();
    final trailModel = TrailModel.fromJson(json.decode(response.body));
    trails.add(trailModel);
    /*setState(() {
      trails.add(trailModel);
    });*/
    return trailModels;
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
          appBar: AppBar(
            title: Text("HikeLocator"),
          ),
          body:
          new RaisedButton(
              child: Text("click me"),

              onPressed: () async {
                final trails = await fetchData();
                Navigator.push(
                  context,
                  new MaterialPageRoute(builder: (context) => new ListScreen(trails)),

                );
              }
          ),

    )
    );
    }
}
//Display ListView in here
class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;
  ListScreen(this.trails);

  //ListScreen(this.trails);
  @override
  Widget build (BuildContext ctxt) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("This is where the list lies"),
        ),
        body: TrailList(trails),
    );
  }
}

//create ListView here which I want displayed on 2nd page
class TrailList extends StatelessWidget {
  final List<TrailModel> trails;

  TrailList(this.trails);

  Widget build(context) {
    return ListView.builder(
        itemCount: trails.length,
        itemBuilder: (context, int index) {
      String myText =  trails[index].trails.toString();

      var splitString = myText.split("\, type");
      var splitString2 = splitString[0];
      var splitString3 = splitString2.split("name: ");
      String name = splitString3[1];

      splitString = myText.split("\, name");
      splitString2 = splitString[0];
      splitString3 = splitString2.split("id: ");
      String id = splitString3[1];

      splitString = myText.split("\, conditionStatus");
      splitString2 = splitString[0];
      splitString3 = splitString2.split("latitude: ");
      String latitude = splitString3[1];
      splitString = myText.split("\, latitude");
      splitString2 = splitString[0];
      splitString3 = splitString2.split("longitude: ");
      String longitude = splitString3[1];
      splitString = myText.split("\, url");
      splitString2 = splitString[0];
      splitString3 = splitString2.split(" location: ");
      String location = splitString3[1];


      return Text("name: $name,\n location: $location, \nlatitude: $latitude, \nlongitude: $longitude\n");

        },
    );
  }
}
class TrailModel{
  Object trails;
  TrailModel(this.trails);
  TrailModel.fromJson(Map<String, dynamic> parsedJson) {
    trails = parsedJson['trails'];

  }
}

导入“包装：颤振/材料.省道”；
导入“包：http/http.dart”；
导入“dart:convert”；
void main（）{
runApp(
材料聚丙烯(
主页：MyApp（），
),
);
}
类MyApp扩展了StatefulWidget{
@凌驾
状态createState（）{
返回主屏幕（）；
}
}
//列表在这里，必须使其成为全局的，这样我可以在2个小部件中访问
列表路径=[]；
类主屏幕扩展状态{
Future fetchData（）异步{
var response=等待获取（'https://www.hikingproject.com/data/get-trails?lat=40.0274&lon=-105.2519&maxDistance=10&key=200419778-6a46042e219d019001dd83b13d58aa59’；
最终跟踪模型=列表（）；
final trailModel=trailModel.fromJson（json.decode（response.body））；
trails.add（trailModel）；
/*设置状态（）{
trails.add（trailModel）；
});*/
返回跟踪模型；
}
@凌驾
小部件构建（构建上下文）{
返回材料PP(
家：脚手架(
appBar:appBar(
标题：文本（“HikeLocator”），
),
正文：
新升起的按钮(
子：文本（“单击我”），
onPressed:（）异步{
最终跟踪=等待获取数据（）；
导航器。推(
上下文
new MaterialPage路线（生成器：（上下文）=>新建列表屏幕（轨迹）），
);
}
),
)
);
}
}
//在此处显示ListView
类ListScreen扩展了无状态小部件{
最后名单；
ListScreen（this.trails）；
//ListScreen（this.trails）；
@凌驾
小部件构建（BuildContext-ctxt）{
归还新脚手架(
appBar：新的appBar(
标题：新文本（“这是列表所在的位置”），
),
正文：TrailList（trails），
);
}
}
//在此处创建我希望在第2页上显示的ListView
类TrailList扩展了无状态小部件{
最后名单；
TrailList（this.trails）；
小部件构建（上下文）{
返回ListView.builder(
itemCount:trails.length，
itemBuilder：（上下文，int索引）{
字符串myText=trails[index].trails.toString（）；
var splitString=myText.split（“\，type”）；
var splitString2=splitString[0]；
var splitString3=splitString2.split（“名称：”）；
字符串名称=splitString3[1]；
splitString=myText.split（“\，name”）；
splitString2=splitString[0]；
splitString3=splitString2.split（“id:”）；
字符串id=splitString3[1]；
splitString=myText.split（“\，conditionStatus”）；
splitString2=splitString[0]；
splitString3=splitString2.split（“纬度：”）；
字符串纬度=拆分字符串3[1]；
splitString=myText.split（“\，纬度”）；
splitString2=splitString[0]；
splitString3=splitString2.split（“经度：”）；
字符串经度=拆分字符串3[1]；
splitString=myText.split（“\，url”）；
splitString2=splitString[0]；
splitString3=splitString2.split（“位置：”）；
字符串位置=拆分字符串3[1]；
返回文本（“名称：$name，\n位置：$location，\n纬度：$latitude，\n长度：$longitude\n”）；
},
);
}
}
类跟踪模型{
物体轨迹；
TrailModel（this.trails）；
TrailModel.fromJson（Map parsedJson）{
trails=parsedJson['trails']；
}
}

---

自从我将一些小部件更改为有状态后，我点击进入下一页的按钮就不再工作了。我尝试传递数据是将trails变量（一个列表）从主屏幕传递到下一页，在列表屏幕中创建构造函数，然后在那里创建ListView。但是，无法进入下一页。我不知道它是否有效。起初我并不打算发布所有的代码，但我认为用完整的图片查看类之间的交互会有所帮助。感谢您的帮助

您可以在

RaisedButton

的

onPressed

方法中使用async/wait方法（注意：需要添加

async

关键字）。因此，我建议您修改

fetchMethod（）

和

onPressed

方法来进行异步处理。您还应该修改

列表屏幕

，以在构造函数中获得

轨迹

我希望这对你有帮助

fetchData（）示例：

Future<List<TrailModel>> fetchData() async {
  final response = await get('url_here');
  final trailModels = List<TrailModel>();
  final trailModel = TrailModel.fromJson(json.decode(response.body));
  trailModels.add(trailModel);
  return trailModels;
}

RaisedButton(
  child: Text("click me"),
  onPressed: () async {
    final trails = await fetchData();
    Navigator.push(
      ctxt,
      new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),
    );
  },
),

class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);

  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("This is where the list lies"),
      ),
      body: TrailList(trails),
    );
  }
}

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeScreen();
  }
}

//List is here, had to make global so I could access in 2 widgets
List<TrailModel> trails = [];

class HomeScreen extends State<MyApp> {

  Future<List<TrailModel>> fetchData() async {
    final response = await get('url_here');
    final trailModels = List<TrailModel>();
    final trailModel = TrailModel.fromJson(json.decode(response.body));
    trailModels.add(trailModel);
    return trailModels;
  }

  @override
  Widget build(BuildContext ctxt) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("HikeLocator"),
        ),
        body:
        new RaisedButton(
            child: Text("click me"),

            onPressed: () async {
              final trails = await fetchData();
              Navigator.push(
                ctxt,
                new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),

              );
            }
        ),
      ),
    );
  }
}

//Display ListView in here
class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);
  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("This is where the list lies"),
        ),
        body:TrailList(trails),
    );
  }
}

//create ListView here which I want displayed on 2nd page
class TrailList extends StatelessWidget {
  final List<TrailModel> trails;

  TrailList(this.trails);

  Widget build(context) {
    return ListView.builder(
      itemCount: trails.length,
      itemBuilder: (context, int index) {
        String myText = trails[index].trails.toString();

        var splitString = myText.split("\, type");
        var splitString2 = splitString[0];
        var splitString3 = splitString2.split("name: ");
        String name = splitString3[1];

        splitString = myText.split("\, name");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("id: ");
        String id = splitString3[1];

        splitString = myText.split("\, conditionStatus");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("latitude: ");
        String latitude = splitString3[1];
        splitString = myText.split("\, latitude");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("longitude: ");
        String longitude = splitString3[1];
        splitString = myText.split("\, url");
        splitString2 = splitString[0];
        splitString3 = splitString2.split(" location: ");
        String location = splitString3[1];


        return Text(
            "name: $name,\n location: $location, \nlatitude: $latitude, \nlongitude: $longitude\n");
      },
    );
  }
}

class TrailModel {
  Object trails;

  TrailModel(this.trails);

  TrailModel.fromJson(Map<String, dynamic> parsedJson) {
    trails = parsedJson['trails'];
  }
}

列表屏幕示例：

Future<List<TrailModel>> fetchData() async {
  final response = await get('url_here');
  final trailModels = List<TrailModel>();
  final trailModel = TrailModel.fromJson(json.decode(response.body));
  trailModels.add(trailModel);
  return trailModels;
}

RaisedButton(
  child: Text("click me"),
  onPressed: () async {
    final trails = await fetchData();
    Navigator.push(
      ctxt,
      new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),
    );
  },
),

class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);

  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("This is where the list lies"),
      ),
      body: TrailList(trails),
    );
  }
}

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeScreen();
  }
}

//List is here, had to make global so I could access in 2 widgets
List<TrailModel> trails = [];

class HomeScreen extends State<MyApp> {

  Future<List<TrailModel>> fetchData() async {
    final response = await get('url_here');
    final trailModels = List<TrailModel>();
    final trailModel = TrailModel.fromJson(json.decode(response.body));
    trailModels.add(trailModel);
    return trailModels;
  }

  @override
  Widget build(BuildContext ctxt) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("HikeLocator"),
        ),
        body:
        new RaisedButton(
            child: Text("click me"),

            onPressed: () async {
              final trails = await fetchData();
              Navigator.push(
                ctxt,
                new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),

              );
            }
        ),
      ),
    );
  }
}

//Display ListView in here
class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);
  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("This is where the list lies"),
        ),
        body:TrailList(trails),
    );
  }
}

//create ListView here which I want displayed on 2nd page
class TrailList extends StatelessWidget {
  final List<TrailModel> trails;

  TrailList(this.trails);

  Widget build(context) {
    return ListView.builder(
      itemCount: trails.length,
      itemBuilder: (context, int index) {
        String myText = trails[index].trails.toString();

        var splitString = myText.split("\, type");
        var splitString2 = splitString[0];
        var splitString3 = splitString2.split("name: ");
        String name = splitString3[1];

        splitString = myText.split("\, name");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("id: ");
        String id = splitString3[1];

        splitString = myText.split("\, conditionStatus");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("latitude: ");
        String latitude = splitString3[1];
        splitString = myText.split("\, latitude");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("longitude: ");
        String longitude = splitString3[1];
        splitString = myText.split("\, url");
        splitString2 = splitString[0];
        splitString3 = splitString2.split(" location: ");
        String location = splitString3[1];


        return Text(
            "name: $name,\n location: $location, \nlatitude: $latitude, \nlongitude: $longitude\n");
      },
    );
  }
}

class TrailModel {
  Object trails;

  TrailModel(this.trails);

  TrailModel.fromJson(Map<String, dynamic> parsedJson) {
    trails = parsedJson['trails'];
  }
}

class ListScreen扩展了无状态小部件{
最后名单；
ListScreen（this.trails）；
@凌驾
小部件构建（BuildContext-ctxt）{
归还新脚手架(
appBar：新的appBar(
标题：新文本（“这是列表所在的位置”），
),
正文：TrailList（trails），
);
}
}

完整示例：

Future<List<TrailModel>> fetchData() async {
  final response = await get('url_here');
  final trailModels = List<TrailModel>();
  final trailModel = TrailModel.fromJson(json.decode(response.body));
  trailModels.add(trailModel);
  return trailModels;
}

RaisedButton(
  child: Text("click me"),
  onPressed: () async {
    final trails = await fetchData();
    Navigator.push(
      ctxt,
      new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),
    );
  },
),

class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);

  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text("This is where the list lies"),
      ),
      body: TrailList(trails),
    );
  }
}

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeScreen();
  }
}

//List is here, had to make global so I could access in 2 widgets
List<TrailModel> trails = [];

class HomeScreen extends State<MyApp> {

  Future<List<TrailModel>> fetchData() async {
    final response = await get('url_here');
    final trailModels = List<TrailModel>();
    final trailModel = TrailModel.fromJson(json.decode(response.body));
    trailModels.add(trailModel);
    return trailModels;
  }

  @override
  Widget build(BuildContext ctxt) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: Text("HikeLocator"),
        ),
        body:
        new RaisedButton(
            child: Text("click me"),

            onPressed: () async {
              final trails = await fetchData();
              Navigator.push(
                ctxt,
                new MaterialPageRoute(builder: (ctxt) => new ListScreen(trails)),

              );
            }
        ),
      ),
    );
  }
}

//Display ListView in here
class ListScreen extends StatelessWidget {
  final List<TrailModel> trails;

  ListScreen(this.trails);
  @override
  Widget build(BuildContext ctxt) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text("This is where the list lies"),
        ),
        body:TrailList(trails),
    );
  }
}

//create ListView here which I want displayed on 2nd page
class TrailList extends StatelessWidget {
  final List<TrailModel> trails;

  TrailList(this.trails);

  Widget build(context) {
    return ListView.builder(
      itemCount: trails.length,
      itemBuilder: (context, int index) {
        String myText = trails[index].trails.toString();

        var splitString = myText.split("\, type");
        var splitString2 = splitString[0];
        var splitString3 = splitString2.split("name: ");
        String name = splitString3[1];

        splitString = myText.split("\, name");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("id: ");
        String id = splitString3[1];

        splitString = myText.split("\, conditionStatus");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("latitude: ");
        String latitude = splitString3[1];
        splitString = myText.split("\, latitude");
        splitString2 = splitString[0];
        splitString3 = splitString2.split("longitude: ");
        String longitude = splitString3[1];
        splitString = myText.split("\, url");
        splitString2 = splitString[0];
        splitString3 = splitString2.split(" location: ");
        String location = splitString3[1];


        return Text(
            "name: $name,\n location: $location, \nlatitude: $latitude, \nlongitude: $longitude\n");
      },
    );
  }
}

class TrailModel {
  Object trails;

  TrailModel(this.trails);

  TrailModel.fromJson(Map<String, dynamic> parsedJson) {
    trails = parsedJson['trails'];
  }
}

导入“包装：颤振/材料.省道”；
void main（）{
runApp（新的MyApp（））；
}
类MyApp扩展了StatefulWidget{
@凌驾
状态createState（）{
返回主屏幕（）；
}
}
//列表在这里，必须使其成为全局的，这样我可以在2个小部件中访问
列表路径=[]；
类主屏幕扩展状态{
Future fetchData（）异步{
最终响应=等待获取（'url_here'）；
最终跟踪模型=列表（）；
final trailModel=trailModel.fromJson（json.decode（response.body））；
trailModels.add（trailModel）；
返回跟踪模型；
}
@凌驾
小部件构建（BuildContext-ctxt）{
返回材料PP(
家：脚手架(
appBar:appBar(
标题：文本（“HikeLocator”），
),
正文：