小程序多选搜索

壹加贰

于 2019-07-15 11:54:31 发布

阅读量606

点赞数

文章标签：小程序搜索小程序搜索多选小程序多选

本文链接：https://blog.csdn.net/One_And_One/article/details/95948291

版权

本文介绍了如何在小程序中实现多选搜索功能。通过展示WXML和JS代码，讲解了如何处理点击事件以实现选中和取消选中，并支持用户进行多项选择。

摘要由CSDN通过智能技术生成

直接上代码

要求：点击选中，再次点击以后取消选中，并且支持多选。

WXML：

<view class="{
  {item.flg?'nav-active':''}}" bindtap='screen' wx:for="{
  {mark}}" wx:key="index" data-index='{
  {index}}'>{
  {mark[index].mark}}</view>

JS：

data:{
    mark: [{ id: "1", mark: "拿本快", flag: "1", create_time: "2019-07-10", flg: false },
         { id: "2", mark: "教练负责", flag: "1", create_time: "2019-07-12", flg: false },
         { id: "3", mark: "合格率高", flag: "1", create_time: "2019-07-10", flg: false },
         { id: "4", mark: "环境好", flag: &