服务端应用提供了用户登录接口，请求这个接口的时候要提供用户名还有密码，服务端验证成功以后，在响应里会包含登录成功的用户名还有给这个用户签发的令牌。

在这个小部件里先声明两个属性，类型是 String，名字是 currentUserName，表示当前成功登录以后的用户的名字，再声明一个属性，类型是 String，名字是 currentUserToken。表示成功登录以后服务端给这个用户签发的令牌。在使用需要验证用户身份的接口的时候会用到这个令牌。

选中这个小部件，按下 command +  .  执行 Convert to StatefulWidget，把这个小部件转换成一个带状态的小部件。

在 build 方法里面，可以在给 Column 提供的这组小组件里，添加一个 Text 小部件，显示的文字是 currentUserName，后面加上两个 ? 号，表示如果这个值是 null，可以显示 未登录 这几个字。再设置一下文字的 style，值是 Theme.of(context) 用一下 textTheme 里的 headline6。

下面再去定义一个方法，名字叫 login，用 async 标记一下，方法里可以声明一个 name ，值是之前我们注册的一个用户的名字，比如王二小，下面再声明一个 password，值是给这个用户设置的密码。再声明一个 uri，它的值可以用 Uri.parse 处理一下用户登录接口，地址是 https://nid-node.ninghao.co/login。

声明一个 response，await，执行一下 http.post 这个方法，使用 HTTP 的 POST 这种方法发送一个 HTTP 请求，请求的地址是 uri，请求里带的数据交给 body 参数，值是一个对象，里面添加一个 'name' ，值是 name，再添加一个 'password'，值是 password。

下面可以在控制台上输出响应的状态码，输出的是 response.statusCode，再输出响应的主体，输出的 response 里的 body 属性的值。

再判断一下，response.statusCode，如果响应的状态码是 200，再声明一个 responseBody，它的值用 jsonDecode 处理一下 response.body。  然后执行一下 setState，在提供的回调里面，设置一下 currentUserName ，它的值就是 responseBody 里的 name。再设置一下 currentUserToken，对应的值是 responseBody 里的 token。

然后再复制一个按钮小部件，把按钮上的文字设置成用户登录，onPressed 的值设置成 login。

在模拟器上测试一下，在练习页面，按一下这个用户登录按钮，成功以后，在界面上会显示登录成功以后的这个用户的名字。按下这个用户登录按钮，应用会请求服务端的用户登录接口，服务端验证了用户的身份以后会响应回来当前登录的用户的名字还有令牌，这个令牌的值我们交给了小部件里的 currentUserToken 这个属性了，在后面我们会用到它的值。