首页 > 解决方案 > 如何通过一项建议将数据转储到 2 个以上的文本字段中?[扑]

问题描述

我想用一个建议自动填充几个文本字段,例如:如果我选择华盛顿作为我居住的州,我希望另一个字段是国家字段,用 US 填充

感谢您的关注!

标签: flutterdart

解决方案


您将需要setState( )onChanged. 在其中setState,您将更改其他字段的值otherDropdownValue。这是 dropDownMenus 的一个小例子。

不要忘记你需要一个StatefulWidget(不是StateLess

代码:

class _MyStatefulWidgetState extends State<MyStatefulWidget> {
  String dropdownValue = 'One';
  String otherDropdownValue = 'Two';

  @override Widget build(BuildContext context) {
    return Column(children: [
        DropdownButton<String>(
          value: dropdownValue,
          onChanged: (String? newValue) {
            //******************************************
            //*****Here is what you are looking for*****
            //******************************************
            setState(() {
              dropdownValue = newValue;
              otherDropdownValue = newValue; ///Changes the other one
            });
            },
          items: <String>['One', 'Two', 'Free', 'Four'].map<DropdownMenuItem<String>>((String value) {
            return DropdownMenuItem<String>(value: value, child: Text(value),);}).toList(),
        ),
      DropdownButton<String>(
        value: otherDropdownValue,
        onChanged: (String? newValue) {
          setState(() {
            otherDropdownValue = newValue; 
          });
        },
        items: <String>['One', 'Two', 'Free', 'Four'].map<DropdownMenuItem<String>>((String value) {
          return DropdownMenuItem<String>(value: value, child: Text(value),);}).toList(),
      ),
      ],
    );
  }
}

让我知道这是否有帮助?

编辑以回答您的最后评论:

与 aTextField或 a应用相同的逻辑textformfield。您将需要添加一个TextEditingController()来控制显示的文本。下面是一个完整的示例(您需要查看的部分在最后)

这是一个解释代码的链接(注意我为您的特定用例调整了代码)

https://flutter.dev/docs/cookbook/forms/text-field-changes

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Retrieve Text Input',
      home: MyCustomForm(),
    );
  }
}

// Define a custom Form widget.
class MyCustomForm extends StatefulWidget {
  const MyCustomForm({Key? key}) : super(key: key);

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

// Define a corresponding State class.
// This class holds data related to the Form.
class _MyCustomFormState extends State<MyCustomForm> {
  // Create a text controller and use it to retrieve the current value
  // of the TextField.
  final myController = TextEditingController();

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

    // Start listening to changes.
    myController.addListener(_printLatestValue);
  }

  @override
  void dispose() {
    // Clean up the controller when the widget is removed from the widget tree.
    // This also removes the _printLatestValue listener.
    myController.dispose();
    super.dispose();
  }

  void _printLatestValue() {
    print('Second text field: ${myController.text}');
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Retrieve Text Input'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            ///********************
            ///**** LOOK HERE  ****
            ///********************
            TextField(
              onChanged: (text) {
                myController.text = text;
              },
            ),
            TextField(
              controller: myController,
            ),
          ],
        ),
      ),
    );
  }
}

推荐阅读