六、文章详情显示及点赞实现《iVX低代码/无代码个人博客制作》

注:iVX也有免费直播课《第八期直播课》

一、文章详情实现

上一节我们已经完成了首页的内容显示,那么此时我们完成点击后跳转到详情页内容。

那么此时由于我们需要跳转到详情页需要对应的数据ID,那么此时还需要给首页的文章数据对象数组一个列:
在这里插入图片描述

接着设置对应的内容事件:
在这里插入图片描述
此时设置了对应的详情ID值为当前循环到的内容的数据ID,也就是对应的哪一条的数据ID。

接下来使用前台跳转到详情页:
在这里插入图片描述
到了文章详情页后我们还需要获取到当前数据ID对应文章数据的详情,那么此时肯定需要一个服务;此时创建一个服务为获取文章详情内容:
在这里插入图片描述
由于获取文章数据需要指定一个 ID,那么我们给这个服务创建一个参数,通过参数找到对应的数据值:
在这里插入图片描述
接着编写事件,直接选择对应的数据库进行输出,给予条件为数据ID等于传入过来的文章ID,在输出值的时候,由于数据ID不可能重复,肯定是只有一条数据,我们直接选择输出的结果为对象数组的某一行值,由于行是从0开始,所以我们选择对应的行号为 0 即可:
在这里插入图片描述

二、详情内容获取

详情获取服务应该是在详情页显示时调用:
在这里插入图片描述
此时直接传递对应的数据ID即可,那么接下来就需要一个容器来接收对应的返回值,由于是只有一条对象数据,那么直接创建一个对象变量,并且命名为详情数据:
在这里插入图片描述

接着给予这个详情数据对应的列:
在这里插入图片描述
该列必须要和数据库中数据列名相同,否则你是取不到的。接下来我们创建了列后,在当前页面显示时,给予返回数据到创建的对象变量:
在这里插入图片描述

接着我们在详情页面中分别绑定这些值到页面上的组件中:
在这里插入图片描述
接着我们预览查看后数据可以照常显示:
在这里插入图片描述

三、评论内容实现

接下来我们开始编写评论去内容,那么首先必然是提交评论内容到数据库,此时还需要创建一个数据库用于存储评论信息,此时这个数据库有两个列:
在这里插入图片描述
评论文章ID是为了知道当前评论信息是哪个文章的数据。

创建好之后,我们创建一个服务提交当前用户的评论信息:
在这里插入图片描述
接着该服务接收两个内容,一个是评论的内容,另一个是评论的文章ID:
在这里插入图片描述
接着我们给评论按钮添加事件,调用评论服务即可,并且清空评论输入框的内容:
在这里插入图片描述
接着我们预览内容后,评论并不会有任何提示,那么此时我们需要创建一个数组,用于存储对应的评论信息,评论之后把评论信息加到当前数组之中,再遍历显示到当前评论区即可;首先创建一个数组:
在这里插入图片描述
在这里插入图片描述

接着创建一个循环,把评论内容放到之下,并且设置循环的数据来源为评论信息对象数组:
在这里插入图片描述
接着我们为显示内容做数据绑定:
在这里插入图片描述
接着我们在评论按钮中添加一个动作,给对应的对象数组添加值,并且创建时间为“刚刚”:
在这里插入图片描述
随后我们输入值后评论即可完成评论显示功能:
在这里插入图片描述

四、评论内容数据库获取

刚刚的功能只是实现了“单机版”内容,此时我们还需要创建一个服务去服务器获取已经评论过的内容,此时需要创建一个服务,命名为评论获取:
在这里插入图片描述
该服务接收一个文章ID作为参数,到数据库中查找对应的评论信息即可:
在这里插入图片描述
接着在详情页显示时增加调用该服务的操作,并且给予评论信息作为存储容器:
在这里插入图片描述
此时我们预览之后,发现当前文章的评论结果已经显示:
在这里插入图片描述

五、点赞实现

接下来我们增加一个点赞服务,接受一个文章数据ID以及一个点赞用户列表作为参数,当点赞动作发生时,添加当前用户到点赞用户列表更新到对应的点赞数据之中,表示当前用户已点击:
在这里插入图片描述
此时那如何在页面中判断用户是否已经点击了呢?我们在前端设置一个一维数组用于判断用户是否点击:
在这里插入图片描述
并且在获取文章数据时,给予文章对应字段给当前的数据列表,那么我们的详情对象数据就要增加该列,并且该列为数组形式:
在这里插入图片描述

此时再到页面的显示事件中指定对应的值内容:
在这里插入图片描述
接着在前端给文本设置事件,点击后即可参与点击:
在这里插入图片描述
不过此时当前事件还是有问题的,点击当前文本后还需要对应的将当前的ID存储到点赞用户列表之中,我们先把对应文章发布页中的昵称变量放到外部:
在这里插入图片描述

当点击的时候判断当前昵称是否存在点赞用户列表,如果不存在则加入,并且更新用户点赞列表,否则将提示未登录或已点赞:
在这里插入图片描述
此时我们回到详情页,点击后并没有任何反应,但是在数据库中已存在点赞用户:
在这里插入图片描述
那么此时点赞后应该在前端有所显示,我们直接在点赞用户外添加一个 if 容器,把点赞操作放到if 之中,并且设置文本若当前用户昵称不属于点赞用户列表,那么就可以点赞:
在这里插入图片描述
如果属于的话我们就显示已点赞,并且不生效事件:
在这里插入图片描述

此时我们再访问内容,会出现已点赞提示:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/286245.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

System.CommandLine选项Option

前一篇简单看了一下CommandLine命令的使用,其实在一个命令行工具中,还有一个重要的点,那就是选项——Option,选项是为命提供参数,就好像C#中方法,Command就像方法,Option就像方法的参数&#xf…

【ArcGIS风暴】ArcGIS10.6栅格计算器(Raster Calculator)用法详解

扩展阅读: 【ArcGIS风暴】ArcGIS 10.2栅格计算器实用公式大全(经典珍藏版) 【ArcGIS风暴】栅格计算器(Raster Calculator)运算出现错误问题及解决方案汇总 文章目录 1. 栅格计算器简介2. 栅格计算器用法3. 简单算术运算4. 数学函数运算5. 空间分析函数运算1. 栅格计算器简…

三、登录页制作《iVX低代码/无代码个人博客制作》

注:iVX也有免费直播课《第八期直播课》 一、登录页实现 本节需要做的登录页如下: 该页面我们复习可以的值,首先设置整个页面页面的垂直和水平对其为居中,随后一个容器包裹对应的登录区域,此时我们创建一个页面命名为…

【C#控件详解】对话框类控件(打开文件,保存文件,选择字体和颜色)

在实际应用中,我们会用到各种各样的对话框,如打开文件,保存文件,选择字体和颜色等等。本文详细讲解C#中的颜色对话框、打开文件对话框、字体对话框、浏览文件夹对话框和保存文件对话框。 文章目录 1. ColorDialog对话框2. FolderBrowserDialog对话框3. FontDialog对话框4. …

动物界的再生一个故事

猪月薪5千,打算用20万建一个窝,老虎不允许,说私自建就是违章建筑,只允许向狼买。 狼是搞工程的,先用20万贿赂老虎取得开发权,再用50万元向老虎买这块地, 花10万元把猪圈盖好,向猪要价…

基于.NetCore开发博客项目 StarBlog - (11) 实现访问统计

系列文章基于.NetCore开发博客项目 StarBlog - (1) 为什么需要自己写一个博客?基于.NetCore开发博客项目 StarBlog - (2) 环境准备和创建项目基于.NetCore开发博客项目 StarBlog - (3) 模型设计基于.NetCore开发博客项目 StarBlog - (4) markdown博客批量导入基于.N…

【SPSS统计分析】SPSS19.0简体中文版安装教程(附SPSS19.0简体中文版下载)

spss19.0中文版是一款专业数据统计软件,受到各种社会学科的研究生、研究员的欢迎。软件能够对信息的采集、处理、分析进行全面评估和预测。spss19.0中文版新增加了广义线性混合模型、自动线性模型、一个统计网页入口portal和直复营销direct marketing功能等。另外,IBM 针对SP…

四、登录注册页功能实现《iVX低代码/无代码个人博客制作》

注:iVX也有免费直播课《第八期直播课》 首先打开在线编辑器进入我们的项目:https://editor.ivx.cn/ 一、登录页功能实现 上一节中已经完成了登录页的页面制作,那么这一节就开始对应的完成登录页的功能实现。 登录页的功能实现主要是对用户…

【ArcGIS风暴】中国756个气象台站分布Shapefile数据下载

在写论文时,通常要做研究区概况图,需要添加气象站点分布,或者在做气温或降水空间插值时,需要将气温和降水数据链接到气象台站上。气象数据通常可以到资源环境科学与数据中心去下载,为了使用的方便,本文分享中国区域756个气象台站shp格式矢量数据,如果你的研究区是西北五…

web上传大文件的配置

1、项目本身的webconfig 在<system.web>字段下 <httpRuntime targetFramework"4.5" requestLengthDiskThreshold"256" maxRequestLength"1000000000" executionTimeout"120"/> 2、找到C:\Windows\System32\inetsrv\confi…

七、文章管理页面及功能实现《iVX低代码/无代码个人博客制作》

注&#xff1a;iVX也有免费直播课《第八期直播课》 一、文章管理页页面制作 文章管理页的基本结构与首页类似&#xff0c;我们复制一个首页&#xff0c;并且重命名首页的名称为文章管理页&#xff1a; 我们接着删除如下图所框选部分内容&#xff1a; 接着重命名导航为内容…

【ArcGIS风暴】ArcGIS快捷键大全

使用快捷键能提高工作效率,本文总结了ArcGIS快捷键大全。当然了,为了个性化定制,也可以在ArcGIS中自定义快捷键。 扩展阅读: 【ArcGIS微课1000例】0015:ArcGIS如何创建/自定义快捷键? 文章目录 1. 访问 ArcMap 菜单命令2. 窗口操纵3. 刷新或暂停地图绘制4. 通过拖放进行…

.net core 抛异常对性能影响的求证之路

一、前言在.net 社区中曾经听到过很多关于大量抛异常会影响性能这样的结论&#xff0c;心中一直就存在各种疑问。项目中使用自定义异常来处理业务很爽&#xff0c;但是又担心大量抛业务异常存在性能问题。查阅了各种文档&#xff0c;微软官方对性能优化这一块也不建议使用过多的…

Android Bootloader LittleKernel的两篇文章 【转】

转自&#xff1a;http://blog.csdn.net/loongembedded/article/details/41747523 2014-12-05 14:37 3599人阅读 评论(2) 收藏 举报分类&#xff1a;Android Bootloader&#xff08;68&#xff09; Android 开发之 ---- bootloader &#xff08;LK&#xff09; LK是什么 LK 是 L…

一、首页第一个首页栏制作【仿淘票票系统前后端完全制作(除支付外)】

首页一共分为3个页面&#xff0c;分别是首页&#xff1a; 影院&#xff1a; 我的&#xff1a; 一、标题头制作 首先我们新建一个 web 相对应用&#xff0c;随后点击前台&#xff0c;在前台新建一个页面&#xff1a; 接着给予这个页面一个背景色&#xff1a; 为了使页面…

C# 11 更加实用的 nameof

C# 11 更加实用的 nameofIntro从 C# 6.0 开始&#xff0c;我们可以开始使用 nameof 来引用参数名称&#xff0c;在可能使用 nameof 的地方&#xff0c;一般都推荐使用以便于重构时的自动更新&#xff0c;在之前的 C# 版本中&#xff0c;如果想要在方法参数中或者方法 attribute…

二、首页影院/我的 栏制作《仿淘票票系统前后端完全制作(除支付外)》

页面效果&#xff0c;影院内容&#xff1a; 我的页分为登录、注册、我的&#xff0c;如果登录了那么就显示我的页面否则显示登录页。 登录页&#xff1a; 我的页&#xff1a; 一、标题头部制作 接着我们点击影院&#xff0c;发现当前页内容为空&#xff1a; 我们的影院页…

【数据库系统经典案例】销售系统数据库分析及完整实现过程

文章目录 一、产品表以及产品添加更新二、顾客管理三、销售记帐四、统计问题一、产品表以及产品添加更新 GOODLUCK的产品表:PRODUCTS(PNO,PNAME,PR,QTY) 从该表可以知: PNO->PNAME、PR、QTY 所以这个表只能按产品编号增加行,也就是说:有新产品了,可以在这个表中…

聊聊 C# 方法重载的底层玩法

最近在看 C 的方法重载&#xff0c;我就在想 C# 中的重载底层是怎么玩的&#xff0c;很多朋友应该知道 C 是不支持重载的&#xff0c;比如下面的代码就会报错。#include <stdio.h>int say() {return 1; } int say(int i) {return i; }int main() {say(10);return 0; }从错…

Nginx图片剪裁模块探究 http_image_filter_module

#yum install -y gd-devel Install add http_image_filter_module Module #./configure --prefix/usr/local/nginx_image_filter/ --with-http_image_filter_module #make && make install use: off:关闭模块处理 test:确保图片是jpeg gif png否则返415错误 size:输出有…