10|无代码开发 | 如何使用Zion实现文章编辑功能

485 阅读2分钟

哈咯~我又来分享学习成果了,今天我们来一看一下如何用Zion来实现文章编辑功能。文章编辑功能常用于编辑已发布的文章内容,可对同一篇文章多次反复编辑和发布,本功能为文章发布功能的拓展,建议大家可以先看一下文章发布功能文档,会更容易学习接下来的内容。我们先来看一下制作后的效果图:

效果

制作思路

  • 文章展示页—放置编辑按钮和文章显示
  • 文章编辑页—多次编辑文章内容

制作过程

第一步:创建文章编辑页

1、复制并粘贴文章发布页

2、修改文字组件的内容

第二步:文章展示页,创建编辑按钮

1、创建按钮,内容栏填入编辑

2、可放置于右下角处,开启悬浮按钮,使编辑按钮始终处于最上方

3、按钮的交互栏绑定跳转—文章编辑行为,并配置参数为远程数据/article/id

第三步:文章编辑页,创建链接数据

1、文章编辑页创建链接数据,命名为articleid,类型为整数

第四步:文章编辑页,创建远程数据

1、文章编辑页创建远程数据,命名为article,数据表选择文章,请求类型为查询,数据限额为1

2、过滤条件为id=链接数据/articleid

第五步:文章编辑页,组件绑定数据

1、文字输入组件的默认值绑定远程数据/article/文章标题等,文章摘要、内容等类似配置

2、图片选择器组件的图片源选择数据绑定,绑定为远程数据/article/文章封面

tips:图片选择器图片源的改变不影响上传图片功能的实现

第六步:文章编辑页,更新按钮行为

1、配置更新按钮的点击时行为—修改表数据—更新文章

2、相关字段下配置对应输入框,如文本信息—输入框/文字输入、封面图片—输入框/图片选择器

3、过滤条件为id=远程数据/article/id,确保更新且只更新,远程数据获取到的文章信息

4、配置成功时行为—跳转—文章展示,参数为刚才更新的文章id,即结果数据/id