如何在Flutter中匹配密码并确认密码?

时间:2019-10-18 05:12:08

标签: flutter dart

我刚学了Flutter。在这里,我想问一下如何匹配密码和确认密码。在这里,我将给出我的代码。我也使用TextField。而且我在这里不使用验证器进行验证

                TextField(
                key: passkey,
                style: new TextStyle(color: Colors.white),
                controller: password,
                decoration: InputDecoration(
                  labelText: 'Password',
                  labelStyle: TextStyle(color: Colors.white),
                  hintStyle: TextStyle(color: Colors.white),
                  icon: const Padding(
                      padding: const EdgeInsets.only(top: 15.0),
                      child: const Icon(
                        Icons.lock_outline,
                        color: Colors.white,
                      )
                      ),
                  errorText: validate ? 'Password Can\'t Be Empty' : null,
                ),
                obscureText: _obscureText,

              ),
              TextField(
                style: new TextStyle(color: Colors.white),
                controller: confirmpassword,
                decoration: InputDecoration(
                  labelText: 'Retype Password',
                  labelStyle: TextStyle(color: Colors.white),
                  hintStyle: TextStyle(color: Colors.white),
                  icon: const Padding(
                      padding: const EdgeInsets.only(top: 15.0),
                      child: const Icon(
                        Icons.lock_outline,
                        color: Colors.white,
                      )),
                  // errorText:
                  // validate ? 'Password Can\'t Be Empty' : null,
                ),
                obscureText: _obscureText,
              ),

3 个答案:

答案 0 :(得分:2)

使用由内置验证器组成的TextFormField小部件

  // Form
  final GlobalKey<FormState> _form = GlobalKey<FormState>();
  final TextEditingController _pass = TextEditingController();
  final TextEditingController _confirmPass = TextEditingController();

  Form(
        key: _form,
        child: ListView(
              children: <Widget>[
                     TextFormField(
                           controller: _pass,
                           validator: (val){
                              if(val.isEmpty)
                                   return 'Empty';
                              return null;
                              }
                     ),
                      TextFormField(
                           controller: _confirmPass,
                           validator: (val){
                              if(val.isEmpty)
                                   return 'Empty';
                              if(val != _pass.text)
                                   return 'Not Match'
                              return null;
                              }
                     ),
                       ]
              )
    )


    // To validate call
    _form.currentState.validate()

答案 1 :(得分:1)

GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  var confirmPass;
TextFormField(
                            validator: (String value) {
                              confirmPass = value;
                              if (value.isEmpty) {
                                return "Please Enter New Password";
                              } else if (value.length < 8) {
                                return "Password must be atleast 8 characters long";
                              } else {
                                return null;
                              }
                            },
                            decoration: InputDecoration(
                              hintText: "Enter New Password",
                              hintStyle: TextStyle(color: Colors.grey),
                              border: new OutlineInputBorder(
                                borderRadius: const BorderRadius.all(
                                  const Radius.circular(40.0),
                                ),
                              ),
                            ),
                          ),
                        ),
                        SizedBox(height: 20),
                        Container(
                          child: TextFormField(
                            validator: (String value) {
                              if (value.isEmpty) {
                                return "Please Re-Enter New Password";
                              } else if (value.length < 8) {
                                return "Password must be atleast 8 characters long";
                              } else if (value != confirmPass) {
                                return "Password must be same as above";
                              } else {
                                return null;
                              }
                            },
                            decoration: InputDecoration(
                              hintText: "Re-Enter New Password",
                              hintStyle: TextStyle(color: Colors.grey),
                              border: new OutlineInputBorder(
                                borderRadius: const BorderRadius.all(
                                  const Radius.circular(40.0),
                                ),
                              ),
                            ),
                          ),
                        ),

答案 2 :(得分:1)

我使用 RxDart 和 Streams 进行了验证。虽然这需要更多的工作,但我保证最终结果会提高性能和用户体验。 Check it out on medium

Here is the git hub project