介绍

官网API

搜索框组件，适用于浏览器的搜索内容输入框等应用场景。

接口

Search(options?: { value?: string, placeholder?: ResourceStr, icon?: string, controller?: SearchController })

常用参数：

• value：string类型，设置当前显示的搜索文本内容，支持$$双向绑定变量。

• placeholder：ResourceStr类型，设置无输入时的提示文本

属性

searchButton

设置搜索框末尾搜索按钮。

searchButton(value: string, option?: SearchButtonOptions)

常用参数：

• value：string类型，必填，搜索框末尾搜索按钮文本内容。

• option：SearchButtonOptions类型，配置搜索框文本样式。默认值：

  {
    fontSize: '16fp',
    fontColor: '#ff3f97e9'
  }
  

事件

onSubmit

点击搜索图标、搜索按钮或者按下软键盘搜索按钮时触发该回调。

onSubmit(callback: (value: string) => void)

参数：

• value：string 类型，搜索输入框的内容

例子

@Entry
@Component
struct Index {
  // 定义 Search 组件的搜索内容
  @State searchContent:string = "iphone17"

  build() {
    // 列示布局
    Column(){

      Search({
        value:this.searchContent,
        placeholder:"请输入内容"
      })
        .searchButton("搜索")
        .onSubmit( value=>{
          console.log("搜索内容：",value)
        })
        .margin({
          left:10,
          right:10,
          bottom:10,
        })
    }

  }
}

原文出处：/show_1GW2GZfSH8c5.html