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

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

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


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


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


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

1.jpg


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

2.jpg


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

3.jpg


引用语句: 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

目录
相关文章
|
1月前
uni-app 155朋友圈评论功能(二)
uni-app 155朋友圈评论功能(二)
40 0
|
1月前
uni-app 152朋友圈动态实时通知功能
uni-app 152朋友圈动态实时通知功能
17 0
|
1月前
uni-app 122转发功能实现(二)
uni-app 122转发功能实现(二)
17 0
|
1月前
uni-app 121转发功能实现(一)
uni-app 121转发功能实现(一)
18 0
|
1月前
uni-app 120撤回消息功能(四)
uni-app 120撤回消息功能(四)
38 0
|
1月前
uni-app 179转发名片功能
uni-app 179转发名片功能
18 1
|
1月前
uni-app 154朋友圈评论功能(一 )
uni-app 154朋友圈评论功能(一 )
13 0
|
1月前
uni-app 162初始化会话列表功能
uni-app 162初始化会话列表功能
12 0
|
1月前
uni-app 160提醒谁看功能
uni-app 160提醒谁看功能
10 0
|
1月前
|
存储 数据库
uni-app 156朋友圈评论表情包功能
uni-app 156朋友圈评论表情包功能
45 0