扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
搜索组件Searchbar提供搜索的功能，并展示搜索的结果。
创新互联于2013年开始，是专业互联网技术服务公司，拥有项目成都做网站、网站设计网站策划，项目实施与项目整合能力。我们以让每一个梦想脱颖而出为使命，1280元武威做网站,已为上家服务,为武威各地企业和个人服务,联系电话:18982081108
{
"usingComponents": {
"mp-searchbar": "../components/searchbar/searchbar"
},
"navigationBarTitleText": "UI组件库"
}
SearchBar
搜索栏
Page({
data: {
inputShowed: false,
inputVal: ""
},
onLoad() {
this.setData({
search: this.search.bind(this)
})
},
search: function (value) {
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve([{text: '搜索结果', value: 1}, {text: '搜索结果2', value: 2}])
}, 200)
})
},
selectResult: function (e) {
console.log('select result', e.detail)
},
});| 属性 | 类型 | 默认值 | 必填 | 说明 |
|---|---|---|---|---|
| ext-class | string | 否 | 添加在组件内部结构的class，可用于修改组件内部的样式 | |
| focus | boolean | false | 否 | 是否在组件开始创建的时候focus搜索输入框 |
| placeholder | string | 搜索 | 否 | 搜索输入框的placeholder |
| value | string | 否 | 搜索输入框的默认值 | |
| search | function | 是 | 输入过程不断调用此函数得到新的搜索结果，参数是输入框的值value，返回Promise实例 | |
| throttle | number | 500 | 否 | 调用search函数的间隔，单位ms |
| cancelText | string | 取消 | 否 | 取消按钮的文本 |
| cancel | boolean | true | 否 | 是否显示取消按钮 |
| bindfocus | eventhandle | 否 | 在输入框focus的时候触发事件 | |
| bindblur | eventhandle | 否 | 在输入框blur的时候触发事件 | |
| bindclear | eventhandle | 否 | 在clear按钮点击的时候触发事件 | |
| bindinput | eventhandle | 否 | 在输入框输入过程中触发事件 | |
| bindselectresult | eventhandle | 否 | 在选择搜索结果的时候触发事件 |
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
微信二维码
移动版官网