分享一个简易的搜索功能微信小程序，也可以在vue使用

搜索的流程：
监听输入框内容，输入后开始匹配列表数据，然后再渲染，清空时，列表重新初始化
data的原始数据

theme:[{
time:1,
name :'张三',
age:'23'
},
{
time:1,
name :'李四',
age:'23'
},
{
time:1,
name :'王二麻子',
age:'23'
}

创建一个空数组，用来渲染我们的列表

themList:[];

然后我们到wxml页面写一个输入框和一个渲染列表的盒子

 <input bindinput="searchTheme"  type="text" placeholder="请输入内容" />

<view wx:for="{{themeList}}" wx:key="index">
 </view>

然后我们就要写我们的方法了

searchTheme(e) {
    console.log(e.detail.value);
    let title = e.detail.value
    let themeList = [];
    let theme = this.data.theme;
    if (title) {
      themeList = theme.filter((value) => {
        return value.title.indexOf(title) !== -1;
      });
      console.log(themeList)
      this.setData({
        themeList: themeList
      })
    } else {
      this.setData({
        themeList: theme
      })
    }
  },

bindinput会返回一个输入框的值，而这个值就是event对象下的detail里的value
获取到值后判断输入框是否有值，有的话，就拿出数据做一个筛选，return返回的就是存在这个字段的列表，然后通过this.setData去更新data里面的数据，如果输入框没有值，那就直接渲染原始数据

注意：如果你使用的vue的话，这里最大的不同就是需要使用watch去监听输入框的值，不然不会更新