Flutter：保存 TextField 值

Question

我是 Flutter 新手。我想实现一个简单的表单功能：

1) 第一页："This is the name:" $stringname

1.1) 点击'Edit icon' --> 打开第二页

2) 第二页："Edit name:" 文本字段

2.1) 使用后退按钮 --> 返回第一页 --> 显示新的 $stringname

[3) 再次访问第二页，Textfield 显示上次保存的名称]

我实现了所有内容（带有编辑图标的第一页，带有后退按钮和文本字段的第二页），但我不知道如何保存新的字符串值并将其发送到第一页。有人可以给我一个简短的例子吗？

TextField(
  obscureText: false,
  decoration: InputDecoration(
    border: OutlineInputBorder(
      borderRadius: BorderRadius.all(
        const Radius.circular(12.0),
      ),
    ),
    labelText: 'Name',
    labelStyle: TextStyle(
      color: Colors.black.withOpacity(0.8)
    ),    
  ),
),

Answer 1

要将数据从第二页返回到第一页，您需要预期在导航到第二页时会收到来自第二页的数据。在第二页上，您需要从 TextField 中获取值，并在将视图弹出回第一页时将其发回，如下所示：

第一页

方法

void goToSecondPage(){
  Navigator.of(context).push(MaterialPageRoute(
    builder: (context){
      return SecondPage();
    }
  )).then((valueFromTextField){
    // use your valueFromTextField from the second page
  });
}

第二页

声明

TextEditingController _textEditingController = TextEditingController();

小部件

Column(
  children: <Widget>[
    TextField(
      controller: _textEditingController,
      obscureText: false,
      decoration: InputDecoration(
        border: OutlineInputBorder(
          borderRadius: BorderRadius.all(
            const Radius.circular(12.0),
          ),
        ),
        labelText: 'Name',
        labelStyle: TextStyle(
          color: Colors.black.withOpacity(0.8)
        ),
      ),
    ),
    RaisedButton(
      onPressed: () => submit(),
    ),
  ],
),

方法

void submit(){
  Navigator.of(context).pop(_textEditingController.text);
}

Flutter：保存 TextField 值

Flutter: Save TextField value

textfield

dart

flutter