使用 APICloud AVM 多端组件快速实现 app 中的搜索功能

很多 app 中都有搜索功能的需求，本文介绍怎么使用 APICloud 的 AVM 多端组件快速实现搜索功能。

在 APICloud 模块库搜索 animate-UISearchBar，添加到项目。多端组件需要下载源码，引入到项目使用。

animate-UISearchBar 有的功能：搜索占位提示语、搜索记录、清除搜索记录、搜索触发事件、取消搜索事件、可使用 css 自定义样式。

下载后解压的组件目录如下图：

其中 animate-UISearchBar.stml 为组件文件，放到项目的 components 目录下，如图：

在需要使用的页面使用 import 语句引入组件 animate-UISearchBar.stml，如图：

引用语句： import "../components/animate-UISearchBar/animate-UISearchBar.stml";

运行效果如下图：

通过以上过程，可以看到使用组件方便快捷，可以提高项目开发效率。

如果对怎么添加模块，调试模块还不熟悉，可参考以下文档：

模块使用教程：https://www.csdn.net/article/2022-01-26/122697219

Studio 3 教程文档：https://docs.apicloud.com/apicloud3/#/overview/devtools?index=0&subIndex=3

Studio 3 真机调试文档： https://docs.apicloud.com/Dev-Tools/studio3-wifi-debug