Flutter頁面內需要大量使用TextEditingController時的一種解決方案

xSILENCEx發表於2019-08-27
FlutterGCController

當使用者輸入大量資訊時，通常會採用TextField列表來解決，這時如果需要對每個TextField進行控制或監聽就需要大量的TextEditingController。

這裡提供另一種思路，解決大量使用TextEditingController和資訊整理困難的問題。

定義一個全域性Map:

Map<String, dynamic> _userInfo;

使用TextField時這樣操作:

////郵箱
 TextField(
    controller: TextEditingController(text: _userInfo['account']),
    onChanged: (value) {
        _userInfo['account'] = value;
    },
),
////暱稱
 TextField(
    controller: TextEditingController(text: _userInfo['nickname']),
    onChanged: (value) {
        _userInfo['nickname'] = value;
    },
),
////密碼
 TextField(
    controller: TextEditingController(text: _userInfo['password']),
    onChanged: (value) {
        _userInfo['password'] = value;
    },
),
複製程式碼

這裡全程未單獨定義TextEditingController，只使TextField用預設的方法進行控制，且可以獲得以下好處:

1.節省大量程式碼，簡化業務邏輯。

2.使用者輸入完成時即得到一個包含所有資訊的Map。

3.輸入的內容不會丟失，只要這個Map不被銷燬，下次進入（或返回）這個頁面所有內容都在，不用要求使用者再次輸入，提升使用者體驗。

第一次發文章，如有問題，歡迎指正。

相關文章