0
votes

Flutter TextFieldInput La valeur ne se met pas à jour après la méthode setState

J'ai un code simple comme ci-dessous:

void processCoupon() async {
    try {
      if (_terms) {
        print("processing mobile number !");
        var data = {"mobile": _authModel.mobile};
        ApiCall().postData(data, cApi).then((result) {
          print(result);
          if (result["data"] != null) {
            print(result["data"]["otp"]);
            setState(() {
              otp = result["data"]["otp"].toString();
            });
           }
        });
      } else {
        print("terms not agreed !");
      }
    } catch (e) {
      print(e);
    }
  }

maintenant j'appelle une api à partir d'une fonction où l' api donne un otp et qui doit être affiché dans le TextFieldInput qui ne s'affiche pas du tout! mais il est affiché dans un Text Widget . Quel peut être le problème.

 TextFormField(
                      initialValue: otp ?? "",
                    ),
                    SizedBox(height: getProportionateScreenHeight(20.0)),
                    Text(otp ?? ""),
                    SizedBox(height: getProportionateScreenHeight(20.0)),

flutter dart input-field

2 commentaires

ce que vous obtenez print(result["data"]["otp"]); ?

le numéro otp.

4 Réponses :

0
votes

 setState(() {
          otp = result["data"]["otp"].toString();
          _editingController.text=otp;
        });

0 commentaires

0
votes

Créez un TextEditingController pour votre TextField :

   void processCoupon() async {
    try {
      if (_terms) {
        print("processing mobile number !");
        var data = {"mobile": _authModel.mobile};
        ApiCall().postData(data, cApi).then((result) {
          print(result);
          if (result["data"] != null) {
            print(result["data"]["otp"]);
            setState(() {
              otp = result["data"]["otp"].toString();
              // set the otp to be the text the controller has
              controller.text = otp; // new line
            });
          }
        });
      } else {
        print("terms not agreed !");
      }
    } catch (e) {
      print(e);
    }
  }

Attribuez le controller à votre TextField :

     TextFormField(
          initialValue: otp ?? "",
          // assign the controller to the TextField
          controller: controller, // new line
        ),
        SizedBox(height: getProportionateScreenHeight(20.0)),
        Text(otp ?? ""),
        SizedBox(height: getProportionateScreenHeight(20.0)),

Attribuez la chaîne otp à la propriété Text du controller :

  // create a controller for the TextField
  TextEditingController controller = TextEditingController();

0 commentaires

0
votes

Je suppose que InitialValue n'est utilisé que dans la première construction, après la mise à jour avec un TextController.

Déclarer:

setState(() {
    otpController.text = result["data"]["otp"].toString();
});

Ajoutez le contrôleur à votre TextFormField:

controller: otpController,

Mettez à jour le texte:

var otpController = TextEditingController();

0 commentaires

0
votes

Je connais la façon dont nous pouvons utiliser le TextController à cette fin, mais le problème est que le formulaire est assez long et c'est là que nous ne pouvons pas utiliser cette méthode car un objet doit être utilisé. le problème était que leur inital value can be passed mais lorsque nous essayons de mettre à jour cette valeur, pour refléter la valeur, nous devons également mettre à jour la clé afin que le inputfield soit également mis à jour. Je viens d'ajouter la valeur ci-dessous et voila! tout fonctionne maintenant bien.

TextFormField(

key: Key(otp), <--- this line was added
                      initialValue: otp ?? "",
                    ),
                    SizedBox(height: getProportionateScreenHeight(20.0)),
                    Text(otp ?? ""),
                    SizedBox(height: getProportionateScreenHeight(20.0)),

0 commentaires