// wxml中引入模板 
<import src="/wxSearch/wxSearch.wxml"/> 
<template is="wxSearch" data="{{wxSearchData}}"/> 
// wxss中引入 @import "/wxSearch/wxSearch.wxss";

// wxSearch作者提供的模板 
<import src="/wxSearch/wxSearch.wxml"/> 
<view class="wxSearch-section">  
<view class="wxSearch-pancel">    
<input bindinput="wxSearchInput" bindfocus="wxSerchFocus" value="{{wxSearchData.value}}" bindblur="wxSearchBlur" class="wxSearch-input" placeholder="搜索" />    
<button class="wxSearch-button" bindtap="wxSearchFn" size="mini" plain="true">搜索</button>  
</view> 
</view> 
<template is="wxSearch" data="{{wxSearchData}}"/>

<import src="../../wxSearch/wxSearch.wxml" /> 
<view class="weui-search-bar"> 
 <view class="weui-search-bar__form">   
 <view class="weui-search-bar__box">     
  <icon class="weui-icon-search_in-box" type="search" size="14"></icon>     
  <input type="text" class="weui-search-bar__input" placeholder="搜索" value="{{wxSearchData.value}}"         bindfocus="wxSerchFocus" bindinput="wxSearchInput" bindblur="wxSearchBlur" />     
  <view class="weui-icon-clear" wx:if="{{inputVal.length > 0}}" bindtap="clearInput">       
  <icon type="clear" size="14"></icon>     
  </view>   
 </view> 
 </view> 
</view> 
<template is="wxSearch" data="{{wxSearchData}}" />

// 搜索輸入框需要保證下面三個(gè)事件的書寫正確 
<input bindfocus="wxSerchFocus" bindinput="wxSearchInput" bindblur="wxSearchBlur" /> 
// 搜索按鈕的事件 <button bindtap="wxSearchFn"/>

wxSearchFn: function(e){
  var that = this
  WxSearch.wxSearchAddHisKey(that);
 },
 wxSearchInput: function(e){
  var that = this
  WxSearch.wxSearchInput(e,that);
 },
 wxSerchFocus: function(e){
  var that = this
  WxSearch.wxSearchFocus(e,that);
 },
 wxSearchBlur: function(e){
  var that = this
  WxSearch.wxSearchBlur(e,that);
 },
 wxSearchKeyTap:function(e){
  var that = this
  WxSearch.wxSearchKeyTap(e,that);
 },
 wxSearchDeleteKey: function(e){
  var that = this
  WxSearch.wxSearchDeleteKey(e,that);
 },
 wxSearchDeleteAll: function(e){
  var that = this;
  WxSearch.wxSearchDeleteAll(that);
 },
 wxSearchTap: function(e){
  var that = this
  WxSearch.wxSearchHiddenPancel(that);
 }

module.exports = {
  init: init,
  initColor: initColors,
  initMindKeys: initMindKeys,
  wxSearchInput: wxSearchInput,
  wxSearchFocus: wxSearchFocus,
  wxSearchBlur: wxSearchBlur,
  wxSearchKeyTap: wxSearchKeyTap,
  wxSearchAddHisKey:wxSearchAddHisKey,
  wxSearchDeleteKey:wxSearchDeleteKey,
  wxSearchDeleteAll:wxSearchDeleteAll,
  wxSearchHiddenPancel:wxSearchHiddenPancel
}
init 初始化wxSearch

參數(shù):that var that = this后傳入即可
barHeight 搜索框高度 根據(jù)你設(shè)定的搜索框高度進(jìn)行設(shè)定
keys 數(shù)組 熱門搜索的顯示內(nèi)容
isShowKey 是否顯示熱門搜索 默認(rèn)顯示(false即可不顯示)
isShowHis 是否顯示歷史搜索 默認(rèn)顯示(false即可不顯示)
callBack 回調(diào)函數(shù)
源碼做了什么 
初始化了wxSearchData的內(nèi)容

wxSearchData:{    
 view:{       
  isShow: false, //是否顯示搜索界面，默認(rèn)隱藏，當(dāng)輸入框獲取焦點(diǎn)時(shí)顯示
  searchbarHeght: 20, //根據(jù)手機(jī)屏幕高度和傳入的barHeight進(jìn)行計(jì)算
  isShowSearchKey: true, //默認(rèn)為true    
  isShowSearchHistory: true, //默認(rèn)為true    }    
  keys:[],//自定義熱門搜索，傳入的keys    
  his:[],//歷史搜索關(guān)鍵字，從緩存中獲取    
  value: '' // 搜索內(nèi)容   } 
wxSearch.init(that, barHeight, keys, isShowKey, isShowHis, callBack)；
initMindKeys 初始化mindKeys 
// mindKeys即為所要檢索內(nèi)容的集合 var mindKeys = ['weappdev.com','微信小程序開發(fā)','微信開發(fā)','微信小程序']; WxSearch.initMindKeys(mindKeys);