一、创建首页
进入到iVX线上编辑器后,选择相对定位。

点击创建后进入到 IDE 之中:

我们在第一步中首先创建一个首页。点击左侧组件栏中的页面组件,创建一个页面:

接着重命名该页面为Home,在页面中创建一个行,命名为main:

设置main的高度为包裹,并且背景色透明:

在main之下创建一个行,设置高度为包裹,重命名为标题:

接着设置一下他们之间的属性信息:

接着创建两个行,一个行命名为内容,在内容之下创建一个行为信息:

之后在在行中添加信息的内容,对象树与展示效果如下:

此时在页面中创建一个对象数组,重命名为信息:

接着在图片中增加列:

接着在对象数组中添加数据:

接着在内容中添加一个for循环组件:

接下来把信息放到for循环之下:

接着为循环创建绑定一个数据来源的值为信息对象数组值:

接着点击一个组件,点击数据绑定:

接着为不同的组件选择合适的值:

其他内容同理可得,接下来预览界面发现会自动使用for循环创建多个内容:

二、数据库创建

接着我们点击导出可以导出数据成xlsx,这一个步骤是为了将该数据存储到数据库之中。

我们点击后台,点击DB进行数据库创建:

接着我们点击导入,选择刚刚导出的内容作为数据库内容:

导入后我们在数据库中可以看到刚刚的数据:

接下来点击后台,再创建一个服务用于数据获取,重命名为数据获取:

服务是数据库与前台之间的逻辑层,我们点击服务对服务进行编辑。在需要做的动作之中旋转信息对象做输出,输出指从数据库往外输出内容,当数据库输出完毕后,当前服务设置自定义的返回结果,返回结果的内容就是输出结果的对象数组的值:

接着我们给该页面添加显示事件,显示后那么启动服务,完成后将对象数组的值赋值为当前服务返回的值:

此时我们对象数组中的值清空后,页面依旧会显示内容,这是因为已经使用服务将数据库的值赋予给页面中的对象数组:

三、搜索功能制作

搜索功能主要是通过输入关键字,再到数据库中判断是否存在相似的内容,从而输出,那么这个时候咱们只需要给搜索按钮点击后有一个事件,这个事件去响应一个搜索服务即可完成。
首先需要做一个搜索服务,搜索服务步骤如下:

接着给点击按钮增加时间即可,传入的关键字则是输入框的值:

服务完毕后直接给予信息对象数组的值即可。

三、发布信息页面制作

此时再添加一个页面如下效果:

为了方便,该页面内容不做过多修饰,点击不同的五角星可以上传不同的图片。

接着咱们为点击图片上传图片编写事件(需要添加文件接口):

其他两张图片同理不再赘述。
此时给home页的发按钮添加点击事件,点击后跳转到发布页:

此时在数据库中添加一个值为内容:

添加一个发布服务:

接着给发布页按钮发布添加时间,启动该服务传递值内容:

接着成功发布内容,数据库中也会有提示:

四、数据分页

首页的数据过多则需要分页,分页需要服务完成。
我们在数据获取服务中看见有输出行数填写框:

这里的行数起始则表示数据库中第几行到第几行内容。若输入1-3则会出现第1、2、3条数据:

此时这两条数据写死并不好,咱们可以使用参数动态响应内容:

此时我们默认输出1-3条数据,那么在首页的显示事件之中,咱们可以将始末参数写死用1和3代替:

此时写死也并不是太好,咱们在home页面中创建两个变量,一个叫始,一个叫末:

并且始的值为1,末的值为3。最后我们将页面显示事件的值换成1和3:

再创建两个按钮,一个为上一页另一个为下一页:

我们点击下一页时,由于每页初始数据条数为3条,那么第一次的数据是起始为1,结束为3,下一页则需要其实位置和结束位置都往下移动3个位置,也就是1+3和3+3。
第一页是1到3条,第二页就是4到7条,依次类推。
所以在此处点击下一页按钮后,调用服务数据获取时,应该给始、末两个变量都加上3,下一页按钮事件如下:

那么上一页则相反是减3:

此时还需要判断上一页的值若等于1则不执行,因为第一页没有上一页,条件只需要是不等于1或大于1即可:
我们点击下一页,发现若没有数据后还可以可以点击:

五、限制下一页

这个时候需要限制下一页按钮的点击。
此时我们点击数据获取服务,在有数据的时候成功返回值,若没有数据就返回0:

接着再到下一页中编写事件,完成数据获取后,返回的结果值不等于0则赋值信息对象数组的值为返回的数据,若返回结果为0说明空数据,空数据则把已经进行加法递增3的始、末变量的值再减少3:

此时我们运行程序发现点下一页空数据时无响应:

六、内容详情页

详情页直接复制 home 页内容即可,添加一个评论区,并且给信息对象数组增加一个内容列即可:

接着还需要在home页的信息对象数组中添加一个列叫做数据ID:


接下来咱们需要在详情页中添加一个ID变量,随后在信息行中添加一个时间,当点击该行时给予ID变量赋值为当前数据的数据ID,并且跳转页面到详情页:

接着添加一个服务通过数据ID查找到合适的内容:

接着在详情页中,添加一个显示时响应的时间,该事件响应后就启动详情服务,并且把数据ID当作参数传递到服务之中,最后将详情页中的信息对象数组赋值为返回的值:


接着将循环创建的数组的数据来源绑定为当前页面中的信息对象数组:

此时运行后我们可以成功进入到页面获取到信息:

七、评论

接下来创建一个数据库,在数据中创建两个列,一个是评论内容,另外一个是评论文章的ID,这个ID对应评论的对应文章:

接着创建一个服务,接收两个参数,一个是评论内容另外一个是ID,最后将两个值存储到当前的服务之中:

接着咱们点击评论按钮启动该服务,传递值:

八、获取评论

获取评论也很简单,只需要传递当前的文章ID既可以在数据库中查找到匹配的内容,返回内容后用一个对象数组存储即可。
首先在详情页创建一个对象数组为评论:

接着在评论行中创建一个for循环循环一个text文本,for循环的数据来源则是评论对象数组,text文本的内容则是评论内容:

接着创建一个服务,通过ID查找评论信息:

接着在页面事件中添加一个动作,这个动作是显示后直接调用获取评论服务,传入ID数据,完成服务后给评论对象数组赋值,该值则为服务返回的数据结果:

最后预览即可看到评论结果:

10分钟做一个新闻问答web站点[iVX低代码实战]相关推荐

  1. dhtmlxTree 10分钟做一个树

    项目中要做个分类树和部门树. 架构师让用dhtmlxTree 做个树出来.以前也没写过树.也不知道怎么做. 下载了dhtmlxTree 组件包.网上找了两篇文档看了看.一句话看了半天也看不出来个所以然 ...

  2. 自然语言处理NLP学习笔记三:使用Django做一个NLP的Web站点

    前言: 前面我们已经能初步实现一个中文自然处理语言的模型了,但交互界面是命令行的,不太友好. 如果想做一个类似http://xiaosi.trs.cn/demo/rs/demo的界面,那就还需要继续往 ...

  3. 手把手教你10分钟做一个音乐播放器

    一.话不多,先看效果: 视频B站效果演示地址~  (大佬勿入,大佬勿入,大佬勿入)这是个单页面音乐播放器,只用到了 html+css 与很基础的vue语法,所以适合初学者,看一看10分钟就会了~ 这个 ...

  4. 蛋糕是叫胚子还是坯子_教你做巧克力淋面蛋糕,掌握这个配比,好看又好吃,10分钟做一个...

    淋面蛋糕不知道从什么时候开始非常流行,它唯美的流淌线条,以及简洁的造型受到很多人的喜爱,这对于没有任何裱花基础的小伙伴来说真是福音,过生日不用再去蛋糕店订蛋糕,而是亲手为家人制作更有意义的蛋糕,虽然并 ...

  5. python跳舞的线_【跳舞的线/教程】10分钟做一个可玩的饭制关卡

    未经作者授权,禁止转载 相关游戏: 跳舞的线.Dancing Line.Unity 简介补充: 七月以后因为某些原因,我可能就不会再做饭制了--(之前挖的坑以后有可能会填,但是肯定有生之年了).最后打 ...

  6. 直播视频讲解-【10分钟完成一个物联网应用】快上车

    直播视频讲解-[10分钟完成一个物联网应用] Java编程哦 Josh操作系统能做什么? 它降低了智能物联网应用开发的难度,给未来大量的创造性应用提供了广阔的平台. 它能让一个高中生甚至是初中生在十分 ...

  7. 10分钟出一个块的BCH,可以作为日常支付?

    中本聪创建比特币的初衷是希望其成为全球支付的货币,作为继承中本聪衣钵的比特币现金更是在这方面不断的努力.比特币平均10分钟出一个块,交易确认的时间也是10分钟左右.10分钟的支付确认时间对于日常支付来 ...

  8. echart 饼图每一块间隙_花10分钟做酱香饼,简单方便又美味,酥脆咸香比买的还要好吃...

    花10分钟做酱香饼,简单方便又美味,酥脆咸香比买的还要好吃 前几年,在单位附近有一家只做酱香饼的小店,刚开张的时候排很长队,我为了一块酱香饼排队半小时.后来买酱香饼的人少了,我三天两头买一块酱香饼解馋 ...

  9. cron 每10分钟执行一次_早餐儿子最爱它,简单卷一卷,10分钟做一大盘,三天两头吃一次...

    早餐儿子最爱它,卷一卷特简单,10分钟做一大盘,三天两头吃一次.俗话说得好"早餐要吃好,午餐要吃饱,晚餐要吃少."可见,早餐的重要性,一般早餐在一日三餐中占30%的热量,碳水化合物 ...

最新文章

  1. LightGBM模型_相关资料整理
  2. 有关oracle数据库中的日期显示问题
  3. oracle eco 开放接口,问题:关于ECO,ECN的API或者INTERFACE
  4. 负载均衡下ajax第二次请求,会话清除第二个AJAX电话
  5. Android组件的通讯-Intent
  6. 当字段过长,鼠标移上去才展示全部,默认只展示部分防止表格比例发生变化
  7. vector 不初始化时什么状态_Vue原理解析(三):初始化时created之前做了什么?...
  8. php-cli和php-fpm FastCgi与PHP-fpm之间的关系
  9. SpringMVC中@Controller和@RequestMapping
  10. plsql 破解注册码
  11. 最短路径spfa算法
  12. 烟雨江南暂排第一,第四届橙瓜网络文学奖入围20年十佳奇幻大神
  13. 征信不好的看过来:征信黑名单能洗白吗?
  14. java 图文混排_图文混排的几种实现方案
  15. Python 数据相关性分析
  16. mac os 开启redis_在Mac os x 安装 Redis
  17. Visual Studio 匹配花括号的背景颜色
  18. 当 input 属性为 number,设置maxlength属性不生效的坑
  19. 国内电子商务网站分析报告
  20. 金城江区~宜州市 网上地图对比

热门文章

  1. .NET 容器环境下创建应用 dump 文件
  2. NET问答: ThreadStatic 和 ThreadLocalT 哪一个更好 ?
  3. MS Learn 宝藏资源库 - 学习经验分享
  4. EntityFramework Core 5.0 VS SQLBulkCopy
  5. ABP框架 v3.0 已发布!
  6. .NET Core开发实战(第22课:异常处理中间件:区分真异常与逻辑异常)--学习笔记(下)...
  7. 分布式应用框架 Dapr
  8. 在ASP.NET Core中编写合格的中间件
  9. C# 8.x 先睹为快
  10. 微软全都要!Win10引入真Linux内核