微信小程序开发中的数据筛选和搜索功能

在微信小程序开发中，数据筛选和搜索功能是非常常见的需求。本文将通过代码案例，详细介绍如何在微信小程序中实现数据筛选和搜索功能。

首先，我们需要准备一些模拟数据，以便后续的示例代码。假设我们有一个商品列表，每个商品有名称、价格和分类三个属性。

var productList = [
  { name: '手机', price: 1999, category: '电子产品' },
  { name: '电视', price: 2999, category: '电子产品' },
  { name: '衣服', price: 99, category: '服装' },
  { name: '手表', price: 599, category: '配饰' },
  { name: '鞋子', price: 299, category: '服装' },
  { name: '耳机', price: 199, category: '电子产品' }
];

接下来，我们将创建一个列表页面，展示商品列表，并提供筛选和搜索功能。

首先，在 index.wxml 文件中，我们创建一个搜索框和一个分类筛选器：

<!-- index.wxml -->
<view>
  <input type="text" bindinput="onSearch" placeholder="请输入关键词" />
  <picker mode="selector