提到 *** 的搜索，各人都能想到在这个搜索框输入要害词后呈现的一系列遐想词。那么这种结果如何通过Axure做出来呢？又有哪些要点呢？

我们天天都在利用 *** 的搜索成果来筛选定位本身想要的商品，只需要输入一个要害词，就能恍惚搜索到包括此要害词的所有商品。本日将为各人讲授如安在原型中浮现该结果。案例结果如下：

一、实现逻辑

当输入框的值为空时，下面的数据项不显示；

当输入框的值不为空时，下面的数据项显示，且数据筛选出包括输入框中要害词的数据项；

按照上面的逻辑，需要用到函数[[LVAR.indexOf(‘searchValue’)]]，对函数举办筛选。

二、元件搭配

在元件库中拉入一个【输入框】作为搜索输入框和一个【中继器】作为数据展示，如下所示：

选中【中继器】，在样式中，为中继器添加默认的数据，在<Cloumn0>这一列填充本身想要的数据项。

三、交互实现

1. 选中【输入框】，添加【文本改变时】的交互事件。需要先对文本添加判定条件，再执行行动，即当输入框的文字长度大于便是1时，执行行动，条件配置如下：

2. 配置条件满意时，显示下面的数据【中继器】，如下图所示：

3. 对数据【中继器】中的数据项举办筛选，主要操作函数[[LVAR.indexOf(‘searchValue’)]]，配置如下图所示：

1）首先点击上图【法则】输入框旁的【fx】，设置筛选函数，为其先添加一个局部变量，即搜索框中的文字。

2）插入变量或函数为[[Item.Column0.indexOf(LVAR1)!=-1]]。

函数的意思为：在中继器中查询文本框中文字呈现的位置，也就是说，每每能返回数字的条目，暗示都是包括文本框文字的。当查询不到文本框文字时，返回值为-1（负1），即不包括查询的要害字。

个中 Item.Column0代表中继器中的数据项。LVAR1代表局部变量为文本框元件文字。!=-1的意思是即解除不包括查询的要害字的数据。

这样呈现的恍惚查询的功效是，只要包括输入框要害词的任意一个字，恍惚查询的选项城市被列出来。

如下图所示：

4. 接下来只需要添加另一个景象功效2。其条件配置为【不然假如然】，行动为：埋没【数据中继器】。如下图所示：

四、最终结果如下

中继器在原型建造中对数据的筛选是一个不错的元件，各人可以多实验利用，有任何问题接待在文章底部留言接头。源文件可以在公家号中留言获取。