时间戳

首页 > 解决方案 > 键入另一个文本字段时，动态文本字段数据将丢失

flutter - 键入另一个文本字段时，动态文本字段数据将丢失

问题描述

我想为用户添加信息创建一个动态文本字段。
但我不知道为什么如果用户首先在房间页面中输入某些内容 房间页面

然后进入楼层页面并输入 楼层页面

回到房间页面，数据中的键将丢失。 在此处输入图像描述

我想知道如何防止动态文本字段数据丢失。非常感谢。

这是源代码这是标签页：

import "package:flutter/material.dart";
import './tab1.dart';

class TabPage extends StatefulWidget {
  @override
  _TabPage createState() => _TabPage();
}

class _TabPage extends State<TabPage> with SingleTickerProviderStateMixin {
    TextEditingController doorNumberController = new TextEditingController();
  List<Widget> _checkingForm = <Widget>[];
  final List<Tab> myTabs = <Tab>[
    Tab(text: 'Room'),
    Tab(text: 'Floor'),
  ];

  int _checkingIndex = 1;
  void _addChecking() {
    _checkingForm = List.from(_checkingForm)
      ..add(Tab1());

    setState(() {
      _checkingIndex += 1;
    });
  }

  TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: myTabs.length);
    _addChecking();
  }

 @override
 void dispose() {
   _tabController.dispose();
   super.dispose();
 }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        bottom: TabBar(
          controller: _tabController,
          tabs: myTabs,
        ),
      ),
      body: TabBarView(
        controller: _tabController,
            children: [
              ListView(
                children: <Widget>[  
                  Text('Add the room number',textAlign: TextAlign.center,style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w900,
                      fontSize: 25),
                  ),
                  IconButton(
                    icon: Icon(Icons.add_circle,color: Colors.lightBlue),
                    onPressed: () {
                        _addChecking();
                      },
                    ),   
                    Column(
                      children:_checkingForm,
                  ),     
                ]
              ),
              ListView(
                  children: <Widget>[
                    Text('Floor:', textAlign: TextAlign.left,style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w900,
                      fontSize: 25),
                    ),
                      Container(              
                            width: 250.0,
                            child: TextField(
                              controller: doorNumberController,
                              decoration: InputDecoration(
                                border: OutlineInputBorder(),
                                labelText: 'Floor:',
                          ),
                        ),
                      ),  
                    ]
              ),
            ]
      ),
    );
  }
}

这是动态文本字段页面：

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

class Tab1 extends StatefulWidget {
  _Tab1 createState() => _Tab1();
  
}

class _Tab1 extends State<Tab1> {
  TextEditingController doorNumberController = new TextEditingController();
  @override
  Widget build(BuildContext context) {
      return Card(
        child: Column(
          children: <Widget>[
                Row( 
                  children: <Widget>[
                    Text('Room:', textAlign: TextAlign.left,style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w900,
                      fontSize: 25),
                    ),
                      Container(              
                            width: 250.0,
                            child: TextField(
                              controller: doorNumberController,
                              decoration: InputDecoration(
                                border: OutlineInputBorder(),
                                labelText: 'Room number:',
                          ),
                        ),
                      ),  
                    ]
                  ),
          ]
        )
      );
  }

}

标签： flutterdart

解决方案

解决方法很简单……只要加上with AutomaticKeepAliveClientMixin<Tab1>就bool get wantKeepAlive => true;可以解决。
谢谢阿尔迪。

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

class Tab1 extends StatefulWidget {

  String input;
  @override
  _Tab1 createState() => _Tab1();
  
}

class _Tab1 extends State<Tab1> with AutomaticKeepAliveClientMixin<Tab1> {
  TextEditingController doorNumberController = new TextEditingController();
  void initState() {
    super.initState();
    //doorNumberController.text=input;
  }
  @override
  Widget build(BuildContext context) {
      return Card(
        child: Column(
          children: <Widget>[
                Row( 
                  children: <Widget>[
                    Text('Room:', textAlign: TextAlign.left,style: TextStyle(
                      color: Colors.black,
                      fontWeight: FontWeight.w900,
                      fontSize: 25),
                    ),
                      Container(              
                            width: 250.0,
                            child: TextField(
                              controller: doorNumberController,
                              decoration: InputDecoration(
                                border: OutlineInputBorder(),
                                labelText: 'Room number:',
                          ),
                        ),
                      ),                  
                    ]
                  ),
                Row(
                  children:<Widget>[
                    IconButton(
                      icon: const Icon(Icons.save),
                      color: Colors.blue,
                        onPressed: () {
                          print(doorNumberController.text);
                      },
                    ),      
                  ]
                ) 
          ]
        )
      );
  }
  bool get wantKeepAlive => true;
}

推荐阅读