Axure教程：使用中继器进行修改表单数据

2023-07-1717:54:15原型设计Comments2,197 views字数 558阅读模式

如何在中继器中修改现有的表单数据。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

原型地址：https://q4cfag.axshare.com文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

1. 我们在上期制作原型图的中继器列表中，操作栏下方增加文本信息“修改”，如下图：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

2. 我们在之前的文章中制作的【新增弹窗】给复制一份，并命名为【修改弹窗】：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

3. 对【修改弹窗】的“确认”按钮文字修改一下，接着对复制过来弹窗中的“确认”的交互动作全部删除：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

4. 复制【新增按钮】的交互状态，粘贴在【修改按钮】上，然后修改“显示隐藏”和移动的动作：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

5. 对【修改按钮】进行添加动作：设置文本-目标（为当前输入框）- 设置为文本 – 设置f（x）函数：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

6. 如修改的目标为下拉选择项时，设置的动作为：设置列表选中项-目标（为当前下拉框）-设置值-设置f（x）函数：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

7. 接着我们依次对弹窗中的输入框/下拉框进行设置。文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

8. 再设置完成以上交互时，我们对【修改按钮】新增一个动作：标记行-当前：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

9. 对【编辑弹窗】的【确认按钮】设置交互：单击时-更新行-已标记：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

10. 对已标记的列进行添加值，设置对应的局部变量和全局变量：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

11. 对以上设置完的交互进行保存：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

12. 接着对【确认】按钮进行设置触发事件的交互：触发事件-取消按钮-单击时：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

13. 最后我们对【确认】按钮设置：取消标记行：文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

Axure教程：使用中继器进行修改表单数据文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

对以上的交互保存之后，我们可以看下，这样中继器的修改表单内容就已经完成啦~文章源自菜鸟学院-https://www.cainiaoxueyuan.com/yuanxing/51654.html

  • 本站内容整理自互联网，仅提供信息存储空间服务，以方便学习之用。如对文章、图片、字体等版权有疑问，请在下方留言，管理员看到后，将第一时间进行处理。
  • 转载请务必保留本文链接：https://www.cainiaoxueyuan.com/yuanxing/51654.html

Comment

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定