首页 文章

如何在flutter中从另一个dart文件中获取Map长度?

提问于
浏览
0

这是我的main.dart文件和map.dart文件的代码 . 这里我试图通过点击map.dart文件中的“从 Map 中删除元素”按钮从Map <>联系人中删除一些键后,从main.dart文件中的map.dart文件获取Map <>联系人的长度 . 我从main.dart文件中的map.dart创建了MyMap类的对象,以获取Map的数据 . 但是我得到的mapLength的初始值是0.但我希望输出应该是Map <>联系人的长度,方法是点击main.dart中的凸起按钮“获取 Map 长度” .

main.dart

import 'package:flutter/material.dart';
import 'package:passing_length/map.dart';

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


class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: new MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {

  var mapPage = new MyMap();


  @override
  Widget build(BuildContext context) {
    return new Scaffold(
        appBar: new AppBar(
          title: new Text(widget.title),
        ),
        body: new Center(
            child: new Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  print(mapPage.mapLength());
                },
                child: new Text("Get length of map"),
              ),
            ),
            new Padding(
              padding: new EdgeInsets.all(20.00),
              child: new RaisedButton(
                onPressed: () {
                  Navigator.push(
                    context,
                    new MaterialPageRoute(builder: (context) => new MyMap()),
                  );
                },
                child: new Text("Goto new Page"),
              ),
            ),
          ],
        )));
  }
}

map.dart

class MyMap extends StatefulWidget {
  @override
  _MyMapState createState() => new _MyMapState();

  int mapLength() {
    return new _MyMapState().mapLength;
  }
}

class _MyMapState extends State<MyMap> {
  Map<String, int> contact = {
    "AAAA": 1111,
    "BBBB": 2222,
    "CCCC": 3333,
    "DDDD": 4444,
    "EEEE": 5555,
    "FFFF": 6666,
    "GGGG": 7777,
  };

  int mapLength = 0;

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: "My Map",
      home: new Scaffold(
          appBar: new AppBar(title: new Text("My Map")),
          body: new Center(
              child: new Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    contact.remove(contact.keys.elementAt(contact.length - 1));
                    mapLength = contact.length;
                    print(mapLength);
                  },
                  child: new Text("Remove element from map"),
                ),
              ),
              new Padding(
                padding: new EdgeInsets.all(20.00),
                child: new RaisedButton(
                  onPressed: () {
                    Navigator.pop(context);
                  },
                  child: new Text("Go Back"),
                ),
              ),
            ],
          ))),
    );
  }
}

2 回答

  • 0

    我是第二个@rmtmckenzie提到的内容,这里编辑了你的代码,以展示如何在两个页面之间传递修改后的联系人 Map :

    main.dart

    void main() => runApp(new MyApp());
    
    class MyApp extends StatelessWidget {
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          title: 'Flutter Demo',
          theme: new ThemeData(
            primarySwatch: Colors.blue,
          ),
          home: new MyHomePage(title: 'Flutter Demo Home Page'),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      MyHomePage({Key key, this.title}) : super(key: key);
    
      final String title;
    
      @override
      _MyHomePageState createState() => new _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> {
      Map<String, int> _contact = new Map();
    
      @override
      Widget build(BuildContext context) {
        return new Scaffold(
          appBar: new AppBar(
            title: new Text(widget.title),
          ),
          body: new Center(
            child: new Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                new Padding(
                  padding: new EdgeInsets.all(20.00),
                  child: new RaisedButton(
                    onPressed: () {
                      print(_contact.length);
                    },
                    child: new Text("Get length of map"),
                  ),
                ),
                new Padding(
                  padding: new EdgeInsets.all(20.00),
                  child: new RaisedButton(
                    onPressed: () {
                      Navigator.push(
                        context,
                        new MaterialPageRoute(builder: (context) => new MyMap()),
                      ).then((contact) {
                        setState(() => _contact = contact);
                      });
                    },
                    child: new Text("Goto new Page"),
                  ),
                ),
              ],
            ),
          ),
        );
      }
    }
    

    map.dart

    class MyMap extends StatefulWidget {
      @override
      _MyMapState createState() => new _MyMapState();
    }
    
    class _MyMapState extends State<MyMap> {
      Map<String, int> contact = {
        "AAAA": 1111,
        "BBBB": 2222,
        "CCCC": 3333,
        "DDDD": 4444,
        "EEEE": 5555,
        "FFFF": 6666,
        "GGGG": 7777,
      };
    
      @override
      Widget build(BuildContext context) {
        return new MaterialApp(
          title: "My Map",
          home: new Scaffold(
            appBar: new AppBar(title: new Text("My Map")),
            body: new Center(
              child: new Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  new Padding(
                    padding: new EdgeInsets.all(20.00),
                    child: new RaisedButton(
                      onPressed: () {
                        contact.remove(contact.keys.elementAt(contact.length - 1));
                      },
                      child: new Text("Remove element from map"),
                    ),
                  ),
                  new Padding(
                    padding: new EdgeInsets.all(20.00),
                    child: new RaisedButton(
                      onPressed: () {
                        Navigator.pop(context, contact);
                      },
                      child: new Text("Go Back"),
                    ),
                  ),
                ],
              ),
            ),
          ),
        );
      }
    }
    

    总而言之,我建议您查看flutter_flux或类似的插件,它允许您在整个应用程序中管理状态,而无需在页面之间连续传递值 . 示例应用程序可以在链接的repo中找到,或here .

  • 0

    要理解为什么这不推荐通过Flutter开始使用codelab,尤其是stateful widgets上的部分,并且可能花一点时间阅读stateful widgetstate文档 .

    但是TLDR如下 - 继承 StatefulWidget 的类应该只用于存储通过构造函数传入的东西,并且应该是不可变的 . 然后,继承 State 的类可以通过 widget.finalMemberVariable 访问这些参数 . 这背后的想法是每次完成封闭小部件中的新构建时,都会创建一个新的 StatefulWidget ,但关联的 State 可能在构建之间是持久的 . 除非您使用GlobalKeys,否则您永远不应该尝试从窗口小部件树中提取信息,但他们不会使用不同的页面和导航器 .

    另外,如果您只是阅读了代码,那么'll see that mapLength is set to 0 and is not changed until the build function - when you'正在调用 return new _MyMapState().mapLength; 您正在创建一个尚未构建的新状态,因此当然 Map 长度为0 .

    这并不是100%清楚你在这里想要做什么,但我会猜测 . 您有一个带有联系人按钮的主页 . 当用户点击它时,他们会被带到联系人页面,在那里他们可以删除联系人 . 当您返回主页面时,您希望获得用户仍然拥有的联系人数量 .

    首先,我建议使用数据库或持久存储联系人的东西 . 这样您就可以添加/删除/编辑它们,它们将在应用程序关闭后继续存在 . 这样您就可以使用从主页和联系人页面访问您创建的数据库的任何方式 - 您在主页上查询数字并在联系人页面上进行实际的数据库操作 . 一个相当容易使用的插件是sqflite,虽然你可以使用其他像Firebase这样的东西 .

    另一个选择是,如果您只想在主页访问联系人数量之后才想要联系人数量,那么当您从状态执行 Navigator.popNavigator.pop(context, contact.length) 时,可以将其传回 . 在您的主页面中,您希望使用Futures(类似于 Navigator.push(...).then((result) { setState(() { this.num = result }) }) )或使用async / await来保存 Navigator.push(...) 的结果 .

    总而言之,似乎你并不清楚如何实际使用Flutter . 我建议首先关注flutter网站上的一些教程和代码,然后再尝试开发自己的应用程序,因为它们会让你更好地了解如何做这种事情 .

相关问题