返回主页
小の白菜
对知识保持敬畏
博客园
首页
新随笔
联系
订阅
管理
随笔 - 54
文章 - 0
评论 - 22
微信小程序–仿朋友圈Pro(内容发布、点赞、评论、回复评论)
微信小程序–仿微信小程序朋友圈Pro(内容发布、点赞、评论、回复评论)
项目开源地址M朋友圈Pro 求个Star
项目背景
基于原来的开源项目 微信小程序仿朋友圈功能开发(发布、点赞、评论等功能)的基础上,终于推陈出新了。
有一说一,这次界面好看多了。至于推陈出新的原因很简单🧐,接了个定制的项目,做完之后就把项目前端开源了。后续会延续原项目基础,保持前端和云开发代码的开源。
项目分析
这次项目完全1:1高仿微信小程序朋友圈,但是额外加了个发帖权限校验(可以去掉),项目小程序端的整体思想如下所示。
数据库设计
1.发帖记录表m_circle_list
2.评论记录表m_comment_list
3.点赞记录表m_thumb_list
4.统一身份校验表uims
项目效果预览
项目关键问题
如何即时刷新点赞和评论页面(即如何给对象数组中的元素赋值)
ilike(e) {
let cid = e.currentTarget.dataset.idx;
let index = e.currentTarget.dataset.index;
let nickname = app.globalData.userInfo.nickName;
let thumblist = list[${index}].thumbPOList
;
let likelist = list[${index}].thumblist
;
Router.UpThumbInfo(cid).then(res => {
this.setData({
[likelist]: this.data.list[index].thumblist + nickname,
})
})
}
如何简短的表示分页查询条件规则
wx.request({
url: Config.SevDomain+‘circlepart’,
method:‘GET’,
data:{
page:parseInt(skipstep/3) + parseInt(skipstep%3)
},
success:res=>{
}
})
如何联查数据库中的三张表并封装返回数据
封装返回数据
public class CirclePartDto {
private CirclePO circlePO;
private List commentPOList;
private List thumbPOList;
public CirclePO getCirclePO() {
return circlePO;
}
public void setCirclePO(CirclePO circlePO) {
this.circlePO = circlePO;
}
public List<CommentPO> getCommentPOList() {
return commentPOList;
}
public void setCommentPOList(List<CommentPO> commentPOList) {
this.commentPOList = commentPOList;
}
public List<String> getThumbPOList() {
return thumbPOList;
}
public void setThumbPOList(List<String> thumbPOList) {
this.thumbPOList = thumbPOList;
}
}
事务多表联查 JPA 核心@Transactional注解
@RestController
public class CirclePartService {
@Autowired
CircleDao circleDao;
@Autowired
CommentDao commentDao;
@Autowired
ThumbDao thumbDao;
@Transactional
@RequestMapping(value = “/circlepart”)
public List GetCircleByLimit(@RequestParam(“page”) Integer page){
Pageable pageable = PageRequest.of(page,3, Sort.by(Sort.Direction.DESC,“createtime”));
List circlePartDtoList = new ArrayList<>();
// stream 转化为 list
List circlePOList = circleDao.findAll(pageable).get().collect(Collectors.toList());
// 查询
for (int i=0;i<circlePOList.size();i++){
CirclePO circlePO = circlePOList.get(i);
Integer id = circlePO.getId();
CirclePartDto circlePartDto = new CirclePartDto();
circlePartDto.setCirclePO(circlePO);
List commentPOList = commentDao.findByCircleidOrderByCreatetime(id);
List thumbPOList = thumbDao.findByCircleid(id);
List nicknameList = new ArrayList<>();
for(int j=0;j<thumbPOList.size();j++){
nicknameList.add(thumbPOList.get(j).getNickname());
}
circlePartDto.setThumbPOList(nicknameList);
circlePartDto.setCommentPOList(commentPOList);
circlePartDtoList.add(circlePartDto);
}
return circlePartDtoList;
}
}
组件和页面之间的通信问题
参考我的文章微信小程序–页面与组件之间如何进行信息传递和函数调用
源码地址
开源不易,求个Star
https://gitee.com/Kindear/CloudUI
参考文档
ThorUI样式组件库 - KeyBoard
ColorUI样式组件库 - Card Nav
标签: 微信小程序, Java
关注我
收藏该文
0 0
« 上一篇: PicGo RequestError: Error: tunneling socket could not be established, cause=connect ECONNREFUSED 127.0.0.1:36677
posted @ 2021-01-05 23:26 Kindear 阅读(138) 评论(1) 编辑 收藏
评论列表
#1楼2021-01-06 08:46
WebAssembly
感谢分享
支持(0) 反对(0)
登录后才能发表评论,立即 登录 或 注册, 访问 网站首页
公告
昵称: Kindear
园龄: 3年9个月
粉丝: 53
关注: 21
+加关注
< 2021年1月 >
日 一 二 三 四 五 六
27 28 29 30 31 1 2
3 4 5 6 7 8 9
10 11 12 13 14 15 16
17 18 19 20 21 22 23
24 25 26 27 28 29 30
31 1 2 3 4 5 6
我的标签
微信小程序(23)
JPA(8)
C++(7)
数学(4)
Linux(3)
数据结构(2)
Debug(2)
Java(2)
MATLAB(1)
NodeJS(1)
更多
积分与排名
积分 - 104130
排名 - 8562
阅读排行榜
- 微信小程序http连接访问解决方案(27046)
- 中标麒麟系统远程桌面连接(13749)
- PTA 邻接矩阵存储图的深度优先遍历(11926)
- 小程序云开发–云函数操作数据库(11483)
- PTA 邻接表存储图的广度优先遍历(20 分)(9769)
推荐排行榜 - Linux (Debian) 安装MySQL 后如何获取登录密码(5)
- Spring JPA 定义查询方法(3)
- 中标麒麟系统远程桌面连接(2)
- Express 配置HTML页面访问(1)
- 微信小程序-基于高德地图API实现天气组件(动态效果)(1)
Copyright © 2021 Kindear
Powered by .NET 5.0 on Kubernetes