小程序筛选功能带wxss 筛选条件：姓名 年龄 年份 奖励 展示数据：符合条件的人的姓名

好的，首先你需要在 wxml 文件中添加对应的筛选条件，例如：

<!-- 筛选条件 -->
<view class="filter">
  <input placeholder="姓名" bindinput="onNameInput"/>
  <input placeholder="年龄" bindinput="onAgeInput"/>
  <input placeholder="年份" bindinput="onYearInput"/>
  <input placeholder="奖励" bindinput="onRewardInput"/>
</view>

<!-- 展示数据 -->
<view class="result">
  <block wx:for="{{filteredData}}" wx:key="index">
    <text>{{item.name}}</text>
  </block>
  <block wx:if="{{filteredData.length === 0}}">
    <text>暂无数据</text>
  </block>
</view>

然后在对应的 js 文件中定义筛选条件和对应的筛选方法，例如：

Page({
  data: {
    // 原始数据
    originalData: [
      {name: '小明', age: 18, year: 2021, reward: '一等奖'},
      {name: '小红', age: 20, year: 2021, reward: '二等奖'},
      {name: '小刚', age: 22, year: 2020, reward: '三等奖'},
    ],
    // 筛选条件
    nameFilter: '',
    ageFilter: '',
    yearFilter: '',
    rewardFilter: '',
  },

  // 输入姓名时更新筛选条件
  onNameInput(e) {
    this.setData({
      nameFilter: e.detail.value,
    })
    this.filterData()
  },

  // 输入年龄时更新筛选条件
  onAgeInput(e) {
    this.setData({
      ageFilter: e.detail.value,
    })
    this.filterData()
  },

  // 输入年份时更新筛选条件
  onYearInput(e) {
    this.setData({
      yearFilter: e.detail.value,
    })
    this.filterData()
  },

  // 输入奖励时更新筛选条件
  onRewardInput(e) {
    this.setData({
      rewardFilter: e.detail.value,
    })
    this.filterData()
  },

  // 筛选数据
  filterData() {
    const { originalData, nameFilter, ageFilter, yearFilter, rewardFilter } = this.data
    const filteredData = originalData.filter(item => {
      return item.name.includes(nameFilter) &&
             (ageFilter === '' || item.age === parseInt(ageFilter)) &&
             (yearFilter === '' || item.year === parseInt(yearFilter)) &&
             item.reward.includes(rewardFilter)
    })
    this.setData({
      filteredData,
    })
  },
})

最后在 wxss 文件中添加样式，例如：

.filter {
  display: flex;
  justify-content: space-between;
  margin-bottom: 10px;
}

.result {
  margin-top: 10px;
}

.result text {
  display: block;
  margin-bottom: 5px;
}