官方搜索组件 searchbar
。(这里我只拿取用到的input框)
<input type="text" class="weui-search-bar__input" placeholder="{{newSearch}}" value="{{value}}" focus="{{focus}}" bindblur="inputBlur" bindfocus="inputFocus" bindinput="inputChange" />
searchbar.js(这里我也就拿取一部分事件)
methods: {
inputFocus: function inputFocus(e) {
this.triggerEvent('focus', e.detail);
},
inputBlur: function inputBlur(e) {
this.setData({
focus: false
});
this.triggerEvent('blur', e.detail);
},
}
如下父组件使用
index.wxml
<mp-searchbar bind:clear="clearInput" bind:blur="inputBlur" bind:focus="inputFocus" bind:input="inputChange"></mp-searchbar>
index.js
/**
* 搜索框
*/
inputBlur:function(e){
console.log(e.detail);
},
inputFocus:function(e){
console.log(e.detail);
},
inputChange:function(e){
this.setData({
value:e.detail.value
})
console.log(e.detail);
},
clearInput:function(){
},