vue项目1-pizza点餐系统10-axios实现登陆
一、登陆思路
从数据库中拿到数据,每个用户信息都是一个对象,需要用数组存储对象信息,然后对比输入的用户信息,如果匹配成功就跳转到home主页,否则提示用户或密码错误。
二、具体操作
1、导入axios
import axios from 'axios'
2、请求数据库数据
onSubmit(){ //console.log('111'); //请求数据 axios.get('/users.json') .then(res =>{ // console.log(res.data) //定义一个数组,遍历data const data = res.data//data里面是还有key的数组 const users =[] for(let key in data){ const user = data[key] //console.log(user) users.push(user)//将user push到数组中 } //实现过滤,filter中有个迭代器,可拿到users数组中的每个user元素,若邮箱密码都一致就返回匹配的对象数组result let result = users.filter((user) =>{ return user.email === this.email && user.password === this.password }) //console.log(result) //判断数组的长度,若大于0就匹配成功即登陆成功 if(result !=null && result.length >0){ this.$router.push({name:"homeLink"}) }else{ alert("账号或密码错误") } }) }