flutter - 如何在不存在于同一文件中的两个小部件之间传递文本值

Question

我有以下小部件，其中每个小部件都存在于它们自己的文件中。
(每个文件中还有很多其他事情。我对其进行了压缩，以使其最小化，以便仅查看此查询所需的内容)。
我希望捕获在一个小部件中传递到TextFormField的值，并在另一个小部件中打印出这些值。
没有可视状态的变化，因此尝试不通过Provider存储这些值，我觉得对于此用例来说这很愚蠢。
因此，查询是关于如何传递每个小部件实例在TextEditingController中捕获的值并将其传递给另一个小部件？
重申一下，以下3个类存在于自己的Dart文件中。
最初，我对这3种方法都坚持使用无状态小部件，但是从我的阅读中可以得知，建议用户使用一个涉及TextEditingController的有状态小部件。
因此，MyField小部件是有状态的。
MyField小部件-这是根据输入的内容将值存储到 Controller 的位置。

class MyField extends StatefulWidget {

  final String title;
  final TextEditingController controller;

  const MyField({this.controller, this.title});

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

class _MyFieldState extends State<MyField> {

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      controller: widget.controller,
    );
  }
}

MyForm窗口小部件-接受上述窗口小部件的2个实例，每个实例都有其自己的 Controller 。
该小部件有助于将文本值向下传递到MyButton小部件。

class MyForm extends StatelessWidget {
  final formKey = GlobalKey<FormState>();

  final nameController = TextEditingController();
  final passController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: formKey,
      child: Stack(
        children: [
          MyField(
            title: 'name',
            controller: nameController,
          ),
          MyField(
            title: 'pass',
            controller: passController,
          ),
          MyButton(
              name: nameController.text,
              pass: passController.text,
              formKey: formKey)
        ],
      ),
    );
  }
}

MyButton窗口小部件-此窗口小部件捕获这些文本值并尝试打印出这些值，并且当前显示为空。

class MyButton extends StatelessWidget {

  final formKey;
  final String name;
  final String pass;

  const MyButton({Key key, this.formKey, this.name, this.pass}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        // I want to be able to retrieve the text via the controllers for the 2 text fields.
        // currently these values are empty which is the issue.
        print('name: $name pass: $pass');
      },
    );
  }
}

Answer 1

这是我的尝试。

需要在MyForm类中从“堆栈”更改为“列”。

使用'formKey'从TextFormField获取值
(尽管我使用了一个formkey，但是我希望从'MyForm'之外控制值而不是通过使用'formkey'获取值。)

import 'package:flutter/material.dart';

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

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

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

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: _buildBody(),
      floatingActionButton: FloatingActionButton(
        onPressed: () {},
        tooltip: 'Increment',
        child: Icon(Icons.add),
      ),
    );
  }

  Widget _buildBody() {
    return MyForm();
  }
}

class MyButton extends StatelessWidget {
  final formKey;
  final String label;

  const MyButton({Key key, this.formKey, this.label}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return RaisedButton(
      onPressed: () {
        // I want to be able to retrieve the text via the controllers for the 2 text fields.
        // currently these values are empty which is the issue.
        print(
            'name: ${formKey.currentWidget.child.children[0].controller.text} ');
        print(
            'pass: ${formKey.currentWidget.child.children[1].controller.text} ');
      },
      child: Text(label),
    );
  }
}

class MyForm extends StatelessWidget {
  final formKey = GlobalKey<FormState>();

  final nameController = TextEditingController();
  final passController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    return Form(
      key: formKey,
      child: Column(
        children: [
          MyField(
            title: 'name',
            controller: nameController,
          ),
          MyField(
            title: 'pass',
            controller: passController,
          ),
          MyButton(label: 'Button', formKey: formKey)
        ],
      ),
    );
  }
}

class MyField extends StatefulWidget {
  final String title;
  final TextEditingController controller;

  const MyField({this.controller, this.title});

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

class _MyFieldState extends State<MyField> {
  @override
  Widget build(BuildContext context) {
    return TextFormField(
      controller: widget.controller,
    );
  }
}