Maison > Article > interface Web > Utilisez Angularjs+mybatis pour créer un système de commentaires
Cette fois, je vais vous apporter le Angularjs+mybatis pour créer un système de commentaires. Quelles sont les précautions pour utiliser Angularjs+mybatis pour créer un système de commentaires ? Ce qui suit est un cas pratique, jetons-y un œil.
J'ai toujours voulu écrire un système de commentaires. Après avoir lu les commentaires sur Duosuo, NetEase et Jianshu, j'ai réfléchi au type de système de commentaires que je devrais mettre en œuvre. La clé du système de commentaires réside dans le nombre de niveaux d'imbrication et la conception des tables de base de données. Il existe de nombreux niveaux d'imbrication, la structure du tableau est complexe et la présentation est lourde. Finalement, nous avons décidé d'implémenter un commentaire de deuxième niveau. Le système est construit par maven et springboot crée rapidement l'environnement Spring. Le frontend utilise angulairejs+bootstrap, le backend utilise springmvc+mybatis et la base de données utilise mysql. Le frontend demande des commentaires sur le fonctionnement de l'API en arrière-plan.
Conception de la table de base de données
##说说表或者文章表 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;
Obtenir le mappeur de commentaires (clé)
<?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>
Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !
Lecture connexe :
Résumé de l'utilisation de Pixi.js
Comment exécuter des instructions ExecJs en Python
Comment créer une TabBar de navigation inférieure sur la page d'accueil de la vue
Utiliser Video.js pour implémenter l'interface de diffusion en direct H5
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!