本文共 6124 字，大约阅读时间需要 20 分钟。

本人前端烂，文章展示部分现在还弄的不好。

效果：

很想实现点击查看详情然后进入查看具体的文章内容，但还不知道怎么弄，有知道的兄弟可以教我一下。

首先npm下载：

cnpm install vue-quill-editor 发表日志模块：

文章详情：

后端：

DROP TABLE IF EXISTS `t_article`;CREATE TABLE `t_article` (  `Id` int(11) NOT NULL AUTO_INCREMENT,  `title` varchar(255) DEFAULT NULL,  `description` varchar(255) DEFAULT NULL,  `content` varchar(4550) DEFAULT NULL,  `createdatetime` timestamp NULL DEFAULT NULL,  PRIMARY KEY (`Id`)) ENGINE=InnoDB DEFAULT CHARSET=utf8;

Java文件：

Controller

@RestController@CrossOriginpublic class ArticleEditController {
           @Autowiredprivate ArticleService articleService;        @ApiOperation(value="添加文章")        @PostMapping("/addarticle")        public String addarticle(@RequestBody  Article vo)        {
               System.out.println("添加文字");            try            {
   articleService.insert(vo);                ApiResult apiResultHandler  = new ApiResult();                apiResultHandler.setCode(200);                return "ok";            }            catch (Exception e)            {
                   e.printStackTrace();            }            return "no";}        @PostMapping("/loadPage")        public Object loadPage(String title)        {
               System.out.println("按照内容查找文章");            List
   
    articles = articleService.findByCondit(title);            HashMap
    
      res = new HashMap<>();            int numbers = articles.size();            res.put("numbers",numbers);            res.put("data",articles);            String users_json = JSON.toJSONString(res);            return users_json;        }    @GetMapping("/AllPage")    public Object AllPage(QueryInfo queryInfo){
           System.out.println("查所有文章");        ApiResult apiResult;        System.out.println(queryInfo);        int numbers = articleService.findAll().size();// 获取数据总数        int pageStart = (queryInfo.getPageNum()-1)*queryInfo.getPageSize();     //   Page
     
       articlePage = new Page<>(page,size);        List
      
        all = articleService.findAll();        apiResult = ApiResultHandler.buildApiResult(200, "请求成功！", all);        HashMap
       
         res = new HashMap<>();;        res.put("numbers",numbers);        res.put("data",all);        return res;    }    }
       
      
     
    
   

实体类：

@Data@ApiModel(value="发布文章", description="发布文章")public class Article implements Serializable{
       private static final long serialVersionUID = 1L;      private int Id;    private String title;    private String description;       private String content;        @JsonFormat(pattern="yyyy-MM-dd HH:mm", timezone="GMT+8")    private Timestamp createdatetime;      @Override    public String toString() {
           return "Article [id=" + Id + ", title=" + title + ", description=" + description + ", content=" + content                + ", articletype=" +  ", createdatetime=" + createdatetime + "]";    }}

用注解的方式写Sql：

package com.naughty.userlogin02.dao;import com.naughty.userlogin02.bean.Article;import org.apache.ibatis.annotations.Insert;import org.apache.ibatis.annotations.Mapper;import org.apache.ibatis.annotations.Options;import org.apache.ibatis.annotations.Select;import org.springframework.stereotype.Repository;import java.util.List;@Mapperpublic interface ArticleDao{
       @Options(useGeneratedKeys = true,keyProperty = "Id")   @Insert("insert into t_article(title,description,content,createdatetime)\n" +           "                values (#{title},#{description},#{content},#{createdatetime}) ")void save(Article vo);        @Select("select title,description,content,createdatetime from t_article where title=#{title}")        List
   
     findByCondit(String title);        @Select("select title,description,content,createdatetime from t_article")        List
    
      findAll();}
    
   

service:

import java.util.List;public interface ArticleService {
       void insert(Article vo);    List
   
     findByCondit(String title);    List
    
      findAll();}
    
   

import java.util.Date;import java.util.List;@Service@Transactionalpublic class ArticleServiceImpl implements ArticleService {
       @Autowired    private ArticleDao articleDao;    @Override    public void insert(Article vo) {
           vo.setCreatedatetime(new Timestamp(new Date().getTime()));        articleDao.save(vo);    }    @Override    public  List
   
     findAll(){
           List
    
      articles2 = articleDao.findAll();        return articles2;    };    @Override   public List
     
       findByCondit(String title) {
           List
      
        articles = articleDao.findByCondit(title);        return articles;    }}
      
     
    
   

注：关于注解@Transactional

事务管理对于企业应用来说是至关重要的，即使出现异常情况，它也可以保证数据的一致性。 Spring Framework对事务管理提供了一致的抽象，其特点如下：

为不同的事务API提供一致的编程模型，比如JTA(Java Transaction API), JDBC, Hibernate, JPA(Java Persistence API和JDO(Java Data Objects)

支持声明式事务管理，特别是基于注解的声明式事务管理，简单易用 提供比其他事务API如JTA更简单的编程式事务管理API 与spring数据访问抽象的完美集成 事务管理方式

spring支持编程式事务管理和声明式事务管理两种方式。

编程式事务管理使用TransactionTemplate或者直接使用底层的PlatformTransactionManager。对于编程式事务管理，spring推荐使用TransactionTemplate。

声明式事务管理建立在AOP之上的。其本质是对方法前后进行拦截，然后在目标方法开始之前创建或者加入一个事务，在执行完目标方法之后根据执行情况提交或者回滚事务。声明式事务最大的优点就是不需要通过编程的方式管理事务，这样就不需要在业务逻辑代码中掺杂事务管理的代码，只需在配置文件中做相关的事务规则声明(或通过基于@Transactional注解的方式)，便可以将事务规则应用到业务逻辑中。

显然声明式事务管理要优于编程式事务管理，这正是spring倡导的非侵入式的开发方式。声明式事务管理使业务代码不受污染，一个普通的POJO对象，只要加上注解就可以获得完全的事务支持。和编程式事务相比，声明式事务唯一不足地方是，后者的最细粒度只能作用到方法级别，无法做到像编程式事务那样可以作用到代码块级别。但是即便有这样的需求，也存在很多变通的方法，比如，可以将需要进行事务管理的代码块独立为方法等等。

声明式事务管理也有两种常用的方式，一种是基于tx和aop名字空间的xml配置文件，另一种就是基于@Transactional注解。显然基于注解的方式更简单易用，更清爽。

转载地址：http://dtten.baihongyu.com/