> 웹 프론트엔드 > JS 튜토리얼 > Angularjs+mybatis를 사용하여 주석 시스템 구축

Angularjs+mybatis를 사용하여 주석 시스템 구축

php中世界最好的语言
풀어 주다: 2018-03-07 11:32:10
원래의
1370명이 탐색했습니다.

이번에는 Angularjs+mybatis를 사용한 댓글 시스템을 소개해 드리겠습니다. Angularjs+mybatis를 댓글 시스템으로 사용할 때 주의사항은 무엇인가요? 다음은 실제 사례입니다. 살펴보겠습니다.

저는 항상 댓글 시스템을 작성하고 싶었습니다. Duoshuo, NetEase, Jianshu의 댓글을 읽고 어떤 종류의 댓글 시스템을 구현해야 할지 생각했습니다. 댓글 시스템의 핵심은 중첩 수준 수와 데이터베이스 테이블 디자인입니다. 중첩 수준이 많고 테이블 구조가 복잡하며 표시가 번거롭습니다. 마침내 우리는 두 번째 수준 주석을 구현하기로 결정했습니다. 시스템은 Maven에 의해 구축되었으며 springboot는 스프링 환경을 신속하게 구축합니다. 프론트엔드는 anglejs+bootstrap을 사용하고, 백엔드는 springmvc+mybatis를 사용하며, 데이터베이스는 mysql을 사용합니다. 프론트엔드는 백그라운드 API 작업 주석을 요청합니다.

디렉터리 구조

Angularjs+mybatis를 사용하여 주석 시스템 구축

데이터베이스 테이블 디자인

##说说表或者文章表  
create table saying (  
        saying_id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,  
        sayingContent VARCHAR(500) NOT NULL,  
        author VARCHAR(50) NOT NULL,  
        sayingAvatar VARCHAR(50) NOT NULL,  
        likes VARCHAR(500) NOT NULL,  
        createTime datetime NOT NULL  
) ENGINE=InnoDB  DEFAULT CHARSET=utf8;  
  
##一级评论表  
create table firstLevelComment (  
        flc_id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,  
        sayingId INT NOT NULL,  
        commenter VARCHAR(50) NOT NULL,  
        commenterAvatar VARCHAR(50) NOT NULL,  
        commentContent VARCHAR(500) NOT NULL,  
        commentTime datetime NOT NULL  
) ENGINE=InnoDB  DEFAULT CHARSET=utf8;  
  
##二级评论表  
create table secondLevelComment (  
        slc_id INT NOT NULL AUTO_INCREMENT PRIMARY KEY,  
        sayingId INT NOT NULL,  
        flcId INT NOT NULL,  
        replier VARCHAR(50) NOT NULL,  
        toCommenter VARCHAR(50) NOT NULL,  
        replyContent VARCHAR(50) NOT NULL,  
        replyTime datetime NOT NULL  
) ENGINE=InnoDB  DEFAULT CHARSET=utf8;
로그인 후 복사

댓글의 매퍼(키) 가져오기

<?xml version="1.0" encoding="UTF-8" ?>  
<!DOCTYPE mapper PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd" >  
<mapper namespace="personal.timeless.cms.mapper.SayingMapper" >  
  
  <resultMap id="SayingMap" type="saying" >  
    <id column="saying_id" property="id" jdbcType="INTEGER" />  
    <result column="sayingContent" property="sayingContent" jdbcType="INTEGER" />  
    <result column="author" property="author" jdbcType="VARCHAR" />  
    <result column="sayingAvatar" property="avatar" jdbcType="VARCHAR" />  
    <result column="likes" property="likes" jdbcType="VARCHAR" />  
    <result column="createTime" property="createTime" jdbcType="TIMESTAMP" />  
    <collection property="flcs" ofType="firstLevelComment" column="sayingId">  
        <id column="flc_id" property="id" jdbcType="INTEGER" />  
        <result column="sayingId" property="sayingId" jdbcType="INTEGER" />  
        <result column="commenter" property="commenter"/>  
        <result column="commenterAvatar" property="avatar"/>  
        <result column="commentContent" property="commentContent"/>  
        <result column="commentTime" property="commentTime" jdbcType="TIMESTAMP" />  
        <collection property="slcs" ofType="secondLevelComment" column="flcId">  
            <id column="slc_id" property="id" jdbcType="INTEGER" />  
            <result column="flcId" property="flcId" jdbcType="INTEGER" />  
            <result column="replier" property="replier"/>  
            <result column="toCommenter" property="toCommenter"/>  
            <result column="replyContent" property="replyContent"/>  
            <result column="replyTime" property="replyTime" jdbcType="TIMESTAMP" />  
        </collection>  
    </collection>  
  </resultMap>  
    
  <select id="selectOneById" resultMap="SayingMap" parameterType="int" >  
    select * from   
    (select * from saying s left join firstLevelComment fc on s.saying_id=fc.sayingId where s.saying_id=#{id}) tmp left join secondLevelComment sc  
    on tmp.flc_id = sc.flcId  
  </select>  
    
   <select id="updateLikesById">  
    update saying set likes = #{likes} where saying_id = #{id}  
  </select>  
 </mapper>
로그인 후 복사

Angularjs+mybatis를 사용하여 주석 시스템 구축

이 기사의 사례를 읽은 후 방법을 마스터했다고 믿습니다. 다른 PHP 중국어 웹사이트 관련 기사도 주목해주세요!

관련 읽기:

Pixi.js 사용 요약

Python에서 ExecJs 문을 실행하는 방법

vue 홈페이지에서 하단 탐색 TabBar를 만드는 방법

Video.js 사용 H5 라이브 방송 인터페이스 구현

위 내용은 Angularjs+mybatis를 사용하여 주석 시스템 구축의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿