用户登录

用户在注册页面,如果成功注册了新的用户以后,可以自动让新注册的这个用户登录。打开 SignupForm 小部件,里面先添加一个属性,类型是 AuthService,名字是 _authService。

然后在小部件的 build 方法里面,设置一下 _authSerivce 的值,它的值是 Provider.of context,类型是 AuthService。

保存一下文件,界面上出现了一个错误提示,说在 SignupForm 小部件的上面没找到 AuthService 这个 Provider。

打开 app.dart,在这个小部件里,用了一个 MultiProvider ,里面添加了一些要提供的东西。先复制一下它里面的这个 providers 列表。

然后选中 MultiProvider,command + . 选择 Remove this widget。删除掉这个小部件。

下面选中 MaterialApp 这个小部件,我们可以在这个小部件的上面提供所有的 Provider,给它添加一个包装小部件,用一下 MultiProvider , 把之前复制的 Provider 列表粘贴到这里。

这样就不会出现之前的错误提示了。

回到 SignupForm 继续编辑一下这个小部件,找到小部件里的 _submitForm 方法,提交注册表单会执行这个方法,成功注册了新的用户以后,这里可以继续执行一下登录。用一下 _authService 上面提供的 login 这个方法。

这个方法需要的 data 参数值的类型是一个 LoginModel ,打开定义 LoginModel 的地方,给它添加一个构造方法,LoginModel,一个对象,里面添加两个东西,this.name,还有 this.password。

回到 SignupForm,给 login 方法提供一个 LoginModel, 里面可以先用 name 设置一下用户名,对应的值就是 _formData 里的 name。 再添加一个 password,对应的值是 _formData 里的 password。

执行了登录,可以再执行一下 Navigator.pop,返回到上一个页面。

测试

下面在应用里试一下,输入要注册的用户名,再设置一下设置的密码。然后按一下 注册新用户。 提示用户已经存在了,可以修改一下要注册的用户名,重新再按一下 注册新用户。

这次注册成功以后,可以自动让新注册的这个用户登录。

用户注册成功自动登录《 Flutter 应用案例: 用户登录 》

统计

14696
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点