Logo FluentUI

Contents

AutoSuggestBox QML Type

提供自动建议功能的文本输入框。. More...

Import Statement: import FluentUI.Controls 1.0

Properties

Signals

  • tap(var data)

Methods

Detailed Description

AutoSuggestBox 是一个带有自动建议功能的文本输入框组件。用户在输入文本时，组件会根据预定义的筛选条件显示匹配的建议列表。

示例用法：

 AutoSuggestBox {
     items: [
         {title: "Apple"},
         {title: "Banana"},
         {title: "Cherry"}
     ]
     filter: function(item) {
         return item.title.indexOf(control.text) !== -1;
     }
     onTap: function(data) {
         console.log("Selected item:", data);
     }
 }

Property Documentation

filter : function

用于过滤项目的函数。默认实现根据 `title` 字段与输入文本的匹配来筛选项目。

例如：

 filter: function(item) {
     return item.title.toLowerCase().indexOf(control.text.toLowerCase()) !== -1;
 }

items : array

用于提供建议的项目数组。每个项目应包含文本字段 `title`，或可以根据 `textRole` 指定其他字段。

例如：

 items: [
     {title: "Apple"},
     {title: "Banana"},
     {title: "Cherry"}
 ]

maximumCount : int

下拉建议框中最多显示的项目数量。默认值为 8。

例如：

 maximumCount: 5

noResultsMessage : string

当没有找到匹配的建议时显示的消息。默认值为 "No results found"。

例如：

 noResultsMessage: qsTr("未找到结果")

textRole : string

用于匹配的文本字段名称。默认值为 "title"。

例如：

 textRole: "name"

Signal Documentation

tap(var data)

当用户点击建议列表中的某项时触发。信号携带被点击的项的数据。

例如：

 onTap: function(data) {
     console.log("Selected item:", data);
 }

Note: The corresponding handler is onTap.


Method Documentation

void close()

关闭下拉建议框。

例如：

 control.close();

void updateText(string text)

更新文本输入框中的文本，并且不触发自动建议。

例如：

 control.updateText("New Text");