Java之Spring Boot+Vue+Element UI前后端分离项目

typeId : this.typeId,

}).then((res) => {

this.$router.push(“/”);

this.$message.success(“文章发布成功！”);

}).catch(() => {

this.$message.error(“文章发布失败！”);

});

},

handleAvatarSuccess(res, file) {

this.imageUrl = URL.createObjectURL(file.raw);

this.thumbnail = “http://localhost:9090/img/” + res;

},

selectType(typename,id) {

this.typeName = typename;

this.typeId = id;

},

beforeAvatarUpload(file) {

const isJPG = file.type === ‘image/jpeg’;

const isLt2M = file.size / 1024 / 1024 < 2;

if (!isJPG) {

this.$message.error(‘上传头像图片只能是 JPG 格式!’);

}

if (!isLt2M) {

this.$message.error(‘上传头像图片大小不能超过 2MB!’);

}

return isJPG && isLt2M;

}

}

}

三、设置Axios发起请求统一前缀的路径

---

https://code100.blog.youkuaiyun.com/article/details/123302546

1、HelloWorld.vue

getInfo() {

this.$http.get(‘blog/queryBlogByPage?title=’ + this.title + ‘&page=’ + this.page + ‘&rows=’ + this.rows)

.then(response => (

this.info = response.data,

this.total = this.info.total,

this.totalPage = this.info.totalPage,

this.items = this.info.items

)).catch(function (error) { // 请求失败处理

console.log(error);

});

},

2、Article.vue

getInfo() {

this.$http.get(‘/blog/queryBlogArticleById?id=’ + this.id )

.then(response => (

this.info = response.data,

this.title = this.info.title

)).catch(function (error) { // 请求失败处理

console.log(error);

});

},

selectBlog() {

this.page = 1;

this.rows = 10;

let startTime = (new Date(((this.value1+“”).split(“,”)[0]))).getTime();

let endTime = (new Date(((this.value1+“”).split(“,”)[1]))).getTime();

this.startBlogTime = startTime;

this.endBlogTime = endTime;

this.getInfo();

},

like(){

this.$http.get(‘blog/blogLikeId?id=’ + this.id );

this.getInfo();

},

四、实现登录功能

---

1、创建ConsumerService

package cn.itbluebox.springbootcsdn.service.Impl;

import cn.itbluebox.springbootcsdn.domain.Consumer;

import cn.itbluebox.springbootcsdn.enums.ExceptionEnum;

import cn.itbluebox.springbootcsdn.exception.BlException;

import cn.itbluebox.springbootcsdn.mapper.ConsumerMapper;

import org.springframework.beans.factory.annotation.Autowired;

import org.springframework.stereotype.Service;

import org.springframework.transaction.annotation.Propagation;

import org.springframework.transaction.annotation.Transactional;

@Service

@Transactional(propagation = Propagation.REQUIRED)

public class ConsumerService {

@Autowired

private ConsumerMapper consumerMapper;

public Boolean checkData(String data, Integer type) {

Consumer consumer = new Consumer();

//判断数据类型

switch (type) {

case 1:

consumer.setEmail(data);

break;

case 2:

consumer.setPhone(Long.parseLong(data));

break;

default:

return null;

}

return consumerMapper.selectCount(consumer) == 0;

}

public Consumer queryUser(String email, String password) {

// 查询

Consumer consumer = new Consumer();

consumer.se