美食杰—登录，注册，退出

今天我们来写页面注册、登录、退出

1.注册

此时是未登录状态，所以头部拥有登录 注册按钮

 点击登录，跳转到登录页面，然后用tab切换，控制登录和注册页面(此效果可用Element UI实现)

如图我们用到Element UI框架的提交表单(详细用法)，绑定事件，input绑定相应的用户名和密码v-model事件。

 

 因为此处是注册页面，提交的时候要向后端发送请求，将用户输入的名字和密码向后端发送请求。

 此时我们就可以注册号账号.

2.登录

 登录页面的表单和注册的一样

依旧在data里面写input输入规则

 

在登录页面需要向后端发送请求，检验后端是否用相同的用户名和密码 

等检验成功时就可以直接跳转到登录状态的首页。而此时头部的登录注册隐藏，出现用户名和退出

 

3.退出 

给退出按钮绑定点击事件

 

在js中写入方法

 此时会弹出提示框

 确定后用户退出，头部登录和注册有显示出来。

注意：头部的显示与隐藏效果实在vuex中getters创建一个方法，判断登录状态。

今天就到这里吧！冲！