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

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

一、文章管理页页面制作

文章管理页的基本结构与首页类似,我们复制一个首页,并且重命名首页的名称为文章管理页:
在这里插入图片描述
在这里插入图片描述
我们接着删除如下图所框选部分内容:

接着重命名导航为内容:
在这里插入图片描述
删除多余的内容留下一个文本并且将文本内容更改成位置列表:
在这里插入图片描述
接着需要更改内容行的属性,使其行可以自动换行并且设置裁剪为 y 轴:
在这里插入图片描述
接着在内容行下创建一个行命名为文章:
在这里插入图片描述
设置文章的高度为包裹:
在这里插入图片描述
接着在文章中添加两个行,一个叫做左一个叫做右,左用于添加对应的左侧文章标题,右对应的添加删除和编辑按钮:
在这里插入图片描述
若想使这两个行能够在一行显示,我们需要设置左右两行的宽度总和为 100%,左行设置宽度为80%,右行设置宽度为 20%,并且由于行自带高度还需要设置高度为包裹:
在这里插入图片描述

此时由于文章文本并没有占据整行,在此需要设置这个文本的宽度为 100%,使其占满整行内容:
在这里插入图片描述
接着设置左行的文本内容为文章标题,设置文本宽度为100%:
在这里插入图片描述
接着在右行设置两个按钮,一个用于文章删除一个用于文章编辑:
在这里插入图片描述
统一设置他们的圆角取消、宽度100%,以及文本更改:
在这里插入图片描述

二、文章删除功能实现

删除文章一般并不是真正的在数据库中对数据进行删除,我们一般使用一个字段标记内容是否删除,在此我们在文章中设置一个字段为“是否删除”:
在这里插入图片描述
接着更改数据库值,0为正常,1为删除:
在这里插入图片描述
接着创建一个服务命名为删除文章,根据传递过来的ID值更改是否删除列的值:
在这里插入图片描述
接着在服务中接收一个参数命名为删除ID,随后在逻辑中选择对应的数据库,随后选择数据库进行有条件的字段更新,设置对应的是否删除为1即可,如果更新成功返回1表示成功否则直接返回失败原因即可:
在这里插入图片描述

三、获取当前作者文章

此时要删除文章数据我们还需要获取当前作者的文章数据,新建一个服务,通过传递一个昵称来获取当前用户的文章内容(最好直接判断当前登录用户):
在这里插入图片描述
此时直接通过传递一个昵称获取跟昵称对应的发布作者文章即可。

接着我们直接更改当前页面的事件即可:
在这里插入图片描述
接着我们创建一个 for 循环把文章行放入其中:
在这里插入图片描述
设置循环创建的数据来源为当前页面中的文章数据:
在这里插入图片描述
接着给文本绑定内容:
在这里插入图片描述
随后给予删除按钮事件,点击后调用服务即可:
在这里插入图片描述
那么此时完成后还需要对应的在当前页面做出响应,直接在当前页面循环文章的文章数据对象数组中删除对应 ID 的一行数据即可,所以此时在完成删除动作后,判断是否成功,如果成功就删除对象数组的内容即可:
在这里插入图片描述
此时我们预览页面成功的查看到元素,接着直接点击删除查看是否有效果:
在这里插入图片描述
点击删除后内容空白,成功完成:
在这里插入图片描述
接着到数据库中更改当前删除的标记为0,咱们此时需要重新给予获取当前用户的文章一个条件,还需要判断文章是否删除,此时更改获取服务:
在这里插入图片描述

四、文章编辑页及功能制作

接着我们复制一个文章发布页作为文章编辑页:
在这里插入图片描述
重命名该页,并且更新发布按钮为更新:
在这里插入图片描述
接着创建一个编辑ID变量存储选择编辑的文章:
在这里插入图片描述
回到管理页,当我们点击了编辑后,跳转到文章编辑页时应该给予编辑ID为点击的文章ID,并且跳转页面:
在这里插入图片描述
随后在文章编辑页创建一个变量存储详情数据,并且给予对应的列名:
在这里插入图片描述
接着给予当前编辑页显示时间,显示时直接调用之前编写的详情服务,传入对应ID之后用详情对象数组存储对应的返回值即可:
在这里插入图片描述
接着我们为页面中的容器绑定值:
在这里插入图片描述
接着创建一个服务为更新内容,接收标题、内容和ID为参数,通过ID进行内容更新:
在这里插入图片描述
最后给更新事件添加服务,传入对应参数即可:
在这里插入图片描述
最后我们更改标题:
在这里插入图片描述
点击更新之后成功更新:在这里插入图片描述
最后首页显示内容已更改:
在这里插入图片描述

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

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

相关文章

【ArcGIS风暴】ArcGIS快捷键大全

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

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

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

Android Bootloader LittleKernel的两篇文章 【转】

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

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

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

C# 11 更加实用的 nameof

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

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

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

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

文章目录 一、产品表以及产品添加更新二、顾客管理三、销售记帐四、统计问题一、产品表以及产品添加更新 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:输出有…

三、我的/登录 栏制作《仿淘票票系统前后端完全制作(除支付外)》

我的页分为登录、注册、我的&#xff0c;如果登录了那么就显示我的页面否则显示登录页。 登录页&#xff1a; 我的页&#xff1a; 一、登录页制作 1.1 登录头制作 首先我们创建一个行&#xff0c;命名为登录块&#xff0c;设置高度为包裹&#xff1a; 之后将会在这个行中…

【NOIP2010】【P1317】乌龟棋

似乎很像搜索的DP&#xff08;应该也可以用搜索写&#xff09; 原题&#xff1a; 小明过生日的时候&#xff0c;爸爸送给他一副乌龟棋当作礼物。乌龟棋的棋盘是一行N 个格子&#xff0c;每个格子上一个分数&#xff08;非负整数&#xff09;。棋盘第1格是唯一的起点&#xff0c…

mysql添加普通用户用于管理单一数据库

2019独角兽企业重金招聘Python工程师标准>>> 使用phpmyadmin进行操作 创建用户&#xff0c;输入密码 关键选择&#xff1a;勾选 Create database with same name and grant all privileges 其他权限一律不要勾选 转载于:https://my.oschina.net/u/2485194/blog/5491…

C# 11 新特性:接口中的静态抽象成员

之前假设我们有一个非常复杂的数学运算方法&#xff1a;public static int Calc(int x, int y) > x y;但是&#xff0c;上述方法只能支持int类型。如果需要传入其它数字类型&#xff0c;需要再次定义&#xff1a;public static double Calc(double x, double y) > x y;…

四、一般页面制作《仿淘票票系统前后端完全制作(除支付外)》

一、播放影片影院页制作 上一节已经做完了首页所有栏目内容&#xff0c;那么点击购票后应该出现对应有购票的影院&#xff0c;选择影院后进入购买票务页。 首先新建一个页面命名为播放该影片的影院&#xff1a; 接着复制首页中的标题栏到播放影片的影院页中&#xff0c;此时…

700行无用 纯 CSS 祝考生 金榜高粽《1_bit 的无用 CSS 代码 》

今天才想起来这回事&#xff0c;没办法就急急忙忙的赶工一下&#xff0c;接下来我就画一下这个海报试试手了&#xff1a; 一、背景制作 1.1 准备工作 先给整个网页制作一个布局吧&#xff0c;直接 flex 搞定&#xff0c;并且使其居中 justify-content、align-items 都要赋值为…

【CASS精品教程】win10安装CAD+CASS过程中出现的错误问题及解决办法集锦

文章目录 1. 无法安装2. 提示DWF Viewer、AutoCAD2008未安装3. 安装完成后一直出现如下窗口4. Win10 64位 cass9.1+cad2008打开后出现Frame主框架程序没有加载。5. 注册程序无法运行,提示由于无法安装此service pack。1. 无法安装 解决办法:开启Administrator,以管理员身份…

(01).NET MAUI实战 建项目

1.概要本系列文章将会针对.NET MAUI实战开发的一些内容&#xff0c;会长期不间断更新我了解学习到的内容。当学习新的软件开发技术时&#xff0c;都会从基础建项目开始MAUI也不例外。ref&#xff1a;https://docs.microsoft.com/zh-cn/dotnet/maui/get-started/first-app?pivo…

Android Studio 引用aar包 更新后找不到新增的方法问题(踩坑)

明明已经更新了aar文件&#xff0c;但死活找不到新增的方法&#xff0c;代码提示里也找不到新增的方法名&#xff0c;但编译能编译&#xff0c;运行也一切正常&#xff0c;只是IDE一直提示错误&#xff0c;有强迫症的小猿好几天都想不明白。 其间有高手指教说&#xff1a;“那…

Asp.net 批量导入Excel用户数据功能加强版

平时我们用Asp.net导入用户&#xff0c;一般是提供一个用户Excel表的模板&#xff0c;实际导入数据时并非有些人愿意按你的模版制表&#xff0c;因此对Asp.net导入功能进行加强&#xff0c;可以导入非模版化的Excel数据&#xff0c;并且支持一次处理多个Sheet表&#xff0c;方便…

C#+Signalr+Vue实现B站视频自动回复评论,当一个最懒程序员!

Part1前言前几天刷到了程序员鱼皮的自动回复视频评论的视频&#xff0c;于是我也想来试试&#xff01;Part2开始第一步打开想要自动回复评论的视频url&#xff0c;打开调试模式&#xff01;然后找到可以触发评论的网络请求可以看到我们的oid是可以唯一确定视频的id,那么这个oid…