资讯详情

资讯详情

swiftui-ui-patterns - searchable

可搜索Searchable意图使用searchable添加带可选作用域和异步结果的原生搜索 UI。核心模式将searchable(text:)绑定到本地状态。对多种搜索模式使用.searchScopes。使用.task(id: searchQuery)或防抖任务避免过度请求。结果加载时显示占位或进度状态。示例带作用域的可搜索MainActorstructExploreView:View{StateprivatevarsearchQueryStateprivatevarsearchScope:SearchScope.allStateprivatevarisSearchingfalseStateprivatevarresults:[SearchResult][]varbody:someView{List{ifisSearching{ProgressView()}else{ForEach(results){resultinSearchRow(result:result)}}}.searchable(text:$searchQuery,placement:.navigationBarDrawer(displayMode:.always),prompt:Text(Search)).searchScopes($searchScope){ForEach(SearchScope.allCases,id:\.self){scopeinText(scope.title)}}.task(id:searchQuery){awaitrunSearch()}}privatefuncrunSearch()async{guard!searchQuery.isEmptyelse{results[]return}isSearchingtruedefer{isSearchingfalse}try?awaitTask.sleep(for:.milliseconds(250))resultsawaitfetchResults(query:searchQuery,scope:searchScope)}}应保留的设计选择当搜索为空或没有结果时显示占位。防抖输入避免刷爆网络。将搜索状态保持在视图本地。陷阱避免对空字符串执行搜索。获取期间不要阻塞主线程。
觉得有用,分享给同行:

为您的企业打造数字门面

稳重轻奢商务风格,端正雅致视觉,长效耐看不易过时。

立即咨询 →