编辑指南:在这篇文章中，作者分享了一套Axure中继器的通用交互模板。笔者逐一分析了原型预告、所需原创、操作步骤，并介绍了过程中需要注意的问题，希望对你有所启发。

上一期我分享了Axure互动百科:Axure全互动模板和视频教程，得到了大家的好评。首先非常感谢。今天我就和大家分享几个互动教程，主要讲中继器中所有的动态互动，包括添加、删除、修改、查询、过滤、排序、分页、翻页、导入、导出等。这个原型可以作为管理后台的内容模板，让我们快速完成一个界面，提高工作效率。

原型演示地址:https://xqp24q.axshare.com

开始教学:

01制作中继器表

1.1页面材料

矩形——根据实际表格内容要求，如果需要6列，放置6个矩形，自行调整矩形的宽度和高度

修改按钮和删除按钮-动态交互使用后续制作

1.2中继器表内容

如下图所示，根据实际情况填写复读机表

1.3互动

我们希望将中继器表的内容传递给中继器中的矩形

当每个项目被加载时，将矩形的文本设置为[[项目。ColumnX]]，X表示列数。例如，对于第一个矩形，我们将其文本设置为[[Item。列1]]，对于第二个矩形，我们将其文本设置为[[item]。列2]]，等等

1.4制作完成后的预览效果

02新系列

2.1页面材料

提交按钮一个、取消按钮一个、关闭按钮一个。输入框——N个根据表格的内容的需求下拉列表——N个，根据报个的内容需求

输入框和下拉列表根据需要，比如名字，不能选择的用输入框，可以选择的用下拉列表。

如下图所示漂亮的放好，然后把上面的组件全部变成动态面板(新面板)，固定在浏览器的中央，默认隐藏。

2.2互动

这里要提到的是，表格的顶部有一个add按钮。单击添加按钮显示新面板。

取消和关闭按钮：鼠标单击时隐藏新增面板提交按钮：鼠标单击提交按钮时，我们首先要添加行，然后隐藏动态面板添加行内容：[[LVAR1]]是一个变量，如果是Column1，我们设置[[LVAR1]]=第一个输入框（下拉列表）的文本值，如果是Column2，我们设置[[LVAR1]]=第2个输入框（下拉列表）的文本值……以此类推

这样加线的动作就基本完成了，但这里还要科普一下。一般来说，在提交时，需要判断必填项是否填写正确。如果正确，可以提交。如果不正确，您需要提示用户再次填写。

03修改线路

3.1页面材料

与新增行一致，可以复制新增面板，然后修改名称修改面板。请注意，一般来说，表中的一行需要唯一编码。例如，员工编号是唯一的，一旦创建就不能修改，因此第一个输入框可以被禁用，或者在这里用一个矩形替换

3.2互动

单击表格中的修改按钮:

我们需要将修改面板中输入框或下拉列表的值设置为列表对应行的内容。在这里，我们设置文本交互。如果是第一个输入框或下拉列表，我们将其文本值设置为[[Item。列1]]，第二个输入框或下拉列表，等等

设置文本后，显示“修改”面板

取消和关闭按钮：鼠标单击时隐藏修改面板提交按钮：鼠标单击提交按钮时，我们首先要更新行，然后隐藏动态面板。

如上所述，表中的一行需要唯一编码。在这种情况下，它是该行的员工编号，因此更新该行的条件是[[LVAR1==Item。Column1]]，LVAR1是一个变量，我们选择员工号输入框，Column1是表中员工号所在的列。

更新内容:[[LVAR1]]是变量。如果是列1，我们设置[[LVAR1]]=第一个输入框(下拉列表)的文本值，如果是列2，我们设置[[LVAR1]]=第二个输入框(下拉列表)的文本值，以此类推

这就基本完成了修改线路的动作。同样，提交时，首先要判断必填项填写是否正确，正确的可以提交；如果它们不正确，您需要提示用户再次填写它们。这不在中继器交互的范围内。

04删除行

点击表格中的删除按钮，执行删除该行的交互。

05查询

5.1页面材料

1个输入框、1个搜索按钮和1个刷新按钮

5.2互动

一般情况下，我们会使用模糊查询。例如，如果我们搜索名字并输入张，我们可以找到所有名字包含张的人。这是模糊搜索，通过过滤事件来完成。

【【项目。第1列。(lvar1) >: -1]]，项的索引。Column1指列表的第一列，LVAR1代表输入框的文本；【【项目。第2栏。(LV R1)>:-1]]的索引...等等

06筛选

6.1页面材料

下拉列表，这里可以用系统下拉列表，也可以用自制下拉列表，如果你觉得演示很难看。

6.2互动

这里有两种情况。如果我们选择全部，我们将移除过滤器

如果没有做出所有选择，我们将添加过滤事件，[[项。ColumnX==this.text]]。比如过滤第一行的时候，也就是[[Item。Column1==this.text]]，过滤第二行时，即[[item。column2 = = this。文本]]...等等

07排序

7.1页面材料

一个向上的三角形，代表升序一个向下的三角形，代表降序

7.2互动

单击升序三角形添加排序，并选择表格对应的列，例如，列1代表第一列，列2代表第二列，以此类推。排序类型根据需要可以是数字、文本、日期，顺序可以是升序。

如果你点击下降三角形，除了顺序选择开关外，它将与上升三角形相同。

08分页

8.1页面材料

有n个矩形，表示有多少页，比如10页，20页，50页，100页...

8.2互动

单击分页矩形时，将中继器每页的项目数设置为矩形显示的数量。

09翻页

9.1页材料

下一个和上一个按钮、输入框和确认按钮

9.2互动

鼠标点击下一页按钮时，设置中继器页面为next鼠标点击上一页按钮时，设置中继器页面为previous鼠标点击确认按钮时，设置中继器页面为value，输入具体页码为[[LVAR1]]，即输入的页面数

10进出口

10.1进口

这只是模拟导入的效果。选择一个文本框并选择一个文件作为类型。

10.2出口

这里也是模拟效果。您需要预先上传文件，然后单击导出按钮打开上传文件的网址。