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

xSILENCEx發表於2019-08-27

當使用者輸入大量資訊時,通常會採用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不被銷燬,下次進入(或返回)這個頁面所有內容都在,不用要求使用者再次輸入,提升使用者體驗。

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

相關文章