LoginSignup
0
0

More than 1 year has passed since last update.

【Dart】非同期取得した値をTextFieldの初期値に入れる方法

Posted at

何をするのか?

非同期で取得した値をTextFieldの初期値に入れるのに詰まったので、備忘録としてまとめていきます。

TextFormFieldではできない?

通常DartでTextFiledに初期値を設定する場合、以下のようにTextFormFieldのinitialValueに値を設定します。
しかしこの方法だと設定する値はビルド時に初期化されるみたいなので、ビルドを通した後に取得した値などを設定した場合には初期値として反映されなくなります。

TextFormField(
    initialValue: "Test",
)

TextEditingController

以上のような理由があるため、ビルド後に取得した値を初期値として反映するためにはTextEditingControllerを使用する必要があります。
コードは省略していますが、まずStatefulWidgetにして画面を開くたびにinitStateが走るようにしておきます。そしてTextEditingControllerクラスをインスタンス変数として定義し、setState内でそのインスタンス変数のtextを更新することで、もう一度initStateがよばれ画面を再構築します。
あとはTextFieldのcontrollerにプロパティにtoken_controllerを設定することで、対象のTextFieldの初期値が反映されます。

final TextEditingController token_controller = TextEditingController();

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

void getValue() {
  // 例としてここではキーチェーンを取得しています。
  FlutterKeychain.get(key: 'token').then((token) => {
    setState(() {
      token_controller.text = token;
    }),
  });
}

// 省略
TextField(
  controller: token_controller,
  // 省略
)

参考

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0