精华内容
下载资源
问答
  • 2019-04-29 11:32:29
    Q: 人员列表页面切换保留筛选项

    ans:

    /**
     * 表单组件在挂载时,将组件的 fields 值赋给对应的交互组件
     */
    componentDidMount() {
        const { fields, pageIndex } = View;
        this.props.form.setFieldsValue(fields);
        this.getUser(pageIndex);
    }
    
    /**
     * 表单组件在卸载时,将对应的交互组件的值赋给组件的 fields
     */
    componentWillUnmount() {
        View.fields = this.props.form.getFieldsValue();
        View.pageIndex = this.state.pageIndex;
    }
    
    

    可以保留所有筛选项以及当前pageIndex等。在组件卸载的时候,都是存储在View当前的实例上。在组件重新加载的时候,又设置当前form的值,以及传递当前pageIndex。

    记录一下~

    更多相关内容
  • 主要为大家详细介绍了基于layui实现高级搜索筛选功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • CoordinatorLayout+CollapsingToolbarLayout实现仿美团外卖,京东,安居客等搜索框上推及筛选项悬停(二)
  • 仿美团外卖,京东,安居客等搜索框上推及筛选项悬停
  • EXCEL中筛选工具怎么没有搜索功能卡饭网本站整理2018-04-01excel是一款数据处理工具,可以在众多的数据中找到想要的经过处理之后的数据,而最直接方便的功能就是筛选。请阅读下文,了解如何对数据进行筛选。如下图所...

    EXCEL中筛选工具怎么没有搜索功能

    卡饭网

    本站整理

    2018-04-01

    excel是一款数据处理工具,可以在众多的数据中找到想要的经过处理之后的数据,而最直接方便的功能就是筛选。请阅读下文,了解如何对数据进行筛选。

    如下图所示的学生成绩中,我们要达到的目的是,找出所有王姓同学的相关成绩:

    ad8a45667416f3258e3bb27f297e14ad.png

    依次单击“数据,筛选”:

    452d9c3caeed1e51accabff5ead9cb1a.png

    单击姓名右边的向下的三角符号,鼠标指向“文本筛选”,然后单击“等于”:

    f14b8d2f541d721c0a8a2876fb541667.png

    设置“等于”后面的文本框里输入“王*”,表示筛选出所有第一个字符是王,后面不限制字数的王姓同学;如果筛选出所有王姓的两个字姓名的同学,比如王媛,则在等于后面输入“王?”,即可筛选出所有姓氏后面只有一个字的同学的相关信息。设置完成后单击“确定”即可:

    21e013c31211a63cdbf34162f14185c6.png

    如下图所示,所筛选出来的结果就是所有王姓同学的成绩等信息:

    b01e13fda985fa0efebb5acd0727ecb3.png

    如果准备达成的目的是筛选出准考证号在(20124020107,30124020107)取值范围的所有学生。则在“准考证号”列单击三角,然后选择“数字筛选”,单击“介于”:

    64118bcba9b58b35247e4f7ae3179be5.png

    设置筛选条件第一行为“大于”,输入“20124020107”,第二行条件为“小于”,输入“30124020107”,然后单击“确定”:

    2ffb21fa05f1b2854316687007913439.png

    ​显示的结果即为准考证号在(20124020107,30124020107)范围以内的学生的数据:

    ec0eec5e586690473e821bc404ccbe08.png

    展开全文
  • 今天小编就为大家分享一篇PHP之多条件混合筛选功能的实现方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 这个时候如果我先筛选了Age列, 再点击操作按钮更新数据会发现,列表上渲染的数据是经过筛选之后的,筛选项并没有被清空,依旧那么亮眼。 为了更好的描述,我把操作按钮换成了Tab页,可以先来对比一下两个页面: ...

    先来说一下我遇到的场景:

    如上图,在点击操作按钮之后,会重新请求列表数据,列表数据更新。这个时候如果我先筛选了Age列, 再点击操作按钮更新数据会发现,列表上渲染的数据是经过筛选之后的,筛选项并没有被清空,依旧那么亮眼。

    为了更好的描述,我把操作按钮换成了Tab页,可以先来对比一下两个页面:

    嘿嘿,我太懒了,大家能区分就行。上图都是没有筛选的情况,如果我筛选之后再切换Tab,就变成了:

     

    筛选条件并没有被清空,但这种情况下,我们希望在切换tab的时候筛选项是清空的, 这个时候就需要合理的使用filteredValue这个属性。

    在使用这个属性之前,先来说明一下这个例子的两个前置条件。

    • 前端分页
    • 前端筛选

    为什么要特意强调这个?

    因为不同使用场景会有差异,如果是后端分页,那么切换页码的时候,筛选条件清不清空,完全取决于需求(正常场景下也不会清空,不然不是意味着永远看不到第二页的筛选数据?)。但前端分页就不一样了,我不需要重新获取列表数据,所以切换分页的时候没有必要清空筛选条件。

    前端筛选还是后端筛选的主要差别在于是不是后端分页。如果是后端分页,前端分页只能从当前页的数据里筛选,而后端分页筛选的是所有数据里符合条件的。

    好了,切入正题,在数据源改变之后如何清空筛选项呢?

    上代码:

    import React, { useEffect, useState, useMemo } from 'react';
    import { Table, Tabs } from 'antd';
    
    const { TabPane } = Tabs;
    
    const data1 = [];
    const data2 = [];
    for (let i = 0; i < 100; i++) {
      data1.push({
        key: i,
        name: `张大 ${i}`,
        age: i,
        address1: `address1 ${i}`,
        address2: `address2 ${i}`,
        address3: `address3 ${i}`,
        address4: `address4 ${i}`,
        address5: `address5 ${i}`,
        address6: `address6 ${i}`,
      });
      data2.push({
        key: i,
        name: `张小 ${i}`,
        age: i,
        address1: `address1 ${i}`,
        address2: `address2 ${i}`,
        address3: `address3 ${i}`,
        address4: `address4 ${i}`,
        address5: `address5 ${i}`,
        address6: `address6 ${i}`,
      });
    }
    
    export default () => {
      const [filteredValue, setFilteredValue] = useState(null);
      const [dataSource, setDataSource] = useState([]);
      const [tabKey, setTabKey] = useState('1');
    
      useEffect(() => {
        setDataSource(data1);
      }, []);
    
      const onTabChange = (key) => {
        setTabKey(key);
        // 改变数据源
        if (key === '2') {
          setDataSource(data2);
        } else {
          setDataSource(data1);
        }
        setFilteredValue(null);
      };
    
      const onTableChange = (pagination, filters) => {
        setFilteredValue(filters);
      };
    
      const columns = useMemo(() => ([
        {
          title: 'Full Name',
          width: 150,
          dataIndex: 'name',
          key: 'name',
          fixed: 'left',
        },
        {
          title: 'Age',
          width: 200,
          dataIndex: 'age',
          key: 'age',
          filters: [
            {
              text: '已成年',
              value: '1',
            },
            {
              text: '未成年',
              value: '0',
            }
          ],
          filteredValue: filteredValue && filteredValue['age'],
          onFilter: (value, record) => {
            if (value === '1' && record.age >= 18) {
              return true;
            }
            if (value === '0' && record.age < 18) {
              return true;
            }
            return false;
          }
        },
        {
          title: 'Column 1',
          dataIndex: 'address1',
          key: 'address1',
          minWidth: 200,
        },
        {
          title: 'Column 2',
          dataIndex: 'address2',
          key: 'address2',
          width: 200,
        },
        {
          title: 'Column 3',
          dataIndex: 'address3',
          key: 'address3',
          width: 150,
        },
        {
          title: 'Column 4',
          dataIndex: 'address4',
          key: 'address4',
          minWidth: 200,
        },
        {
          title: 'Column 5',
          dataIndex: 'address5',
          key: 'address5',
          width: 200,
        },
        {
          title: 'Column 6',
          dataIndex: 'address6',
          key: 'address6',
          fixed: 'right',
          width: 150,
        }
      ]), [filteredValue]);
    
      return (
        <>
          <Tabs defaultActiveKey={tabKey} onChange={onTabChange} type="card">
            <TabPane tab="Tab 1" key="1">
            </TabPane>
            <TabPane tab="Tab 2" key="2">
            </TabPane>
          </Tabs>
          <Table
            bordered
            columns={columns}
            dataSource={dataSource}
            scroll={{ x: 1450, y: 300 }}
            onChange={onTableChange}
          />
        </>
      )
    }

    我这里是自己造的假数据,在做业务的时候,替换成接口就好啦!这里也是仅做参考了。

    喔,这里还要多说一句,虽然我在这里将filteredValue设置为空,解决了这个问题。但是,我们内部封装的组件新增了一些属性,设置为空会有问题。比如,这个全选(看了一下源码,里面使用了sort方法,但我这个null又不是数组,肯定会报错,这里仅仅是拿我们团队内部的封装举个栗子):

     当然,如果大家有需求,也可以自己写全选项,注意其他复选项和全选的关联即可。

    以上图为例:

    • 勾选了已生成、未生成,全选自动勾上;
    • 勾选全选,已生成、未生成自动勾上,
    • 前提是全选,取消已生成或者未生成中的一个,全选的勾去掉

    不过,如果只是使用antd中的筛选组件,用上面的方法清空筛选项是没有问题哦!

    有其他想法的小伙伴,欢迎大家留言呀!

    展开全文
  • 随着电脑的使用率越来越高,我们有时候可能会遇到win7系统搜索时提示“没有与搜索条件匹配的问题,如果我们遇到了win7系统搜索时提示“没有与搜索条件匹配的的问题,要怎么处理win7系统搜索时提示“没有与搜索...

    随着电脑的使用率越来越高,我们有时候可能会遇到win7系统搜索时提示“没有与搜索条件匹配的项问题,如果我们遇到了win7系统搜索时提示“没有与搜索条件匹配的项的问题,要怎么处理win7系统搜索时提示“没有与搜索条件匹配的项呢?我们只用1、先确定Windows Search 服务已经启动,依次打开“控制面板”》“管理工具”》“服务”,找到“Windows Search“服务,如果该服务没有启动,则先启动该服务; 2、回到“控制面板”,找到“索引选项”;就行了;接下来给大家带来win7系统搜索时提示“没有与搜索条件匹配的项的详细解决方法:

    1、先确定Windows Search 服务已经启动,依次打开“控制面板”》“管理工具”》“服务”,找到“Windows Search“服务,如果该服务没有启动,则先启动该服务;

    0S921A09-0.jpg

    2、回到“控制面板”,找到“索引选项”;

    0S9215440-1.jpg

    3、在打开的“索引选项”对话框中,选择“高级”按钮;

    0S9212a2-2.jpg

    4、在“高级选项”对话框中,选择“文件类型”。如果你之前没有启动Windows Search服务的话,是没有“文件类型”选项框的;

    0S9215121-3.jpg

    5、在“文件类型”的列表中中找到扩展名为json的一项,如果没有,则可以在红框标注的位置添加新扩展名;

    0S9212a6-4.jpg

    6、将该项默认的筛选器描述是“文件属性筛选器”,改成“纯文本筛选器”,勾选红框标注的单选框”为属性和文件内容添加索引“;

    0S9216352-5.jpg

    7、重新搜索关键词,这时候的搜索结果就包括扩展名为json的文件。

    0S921CK-6.jpg

    关于Win7系统搜索时提示“没有与搜索条件匹配的项”如何解决就给大家介绍到这边了,有遇到这样情况的用户们可以采取上面的方法来解决吧。

    以上就是关于win7系统搜索时提示“没有与搜索条件匹配的项”的解决方法,还有不会的朋友可以按照上面的步骤来解决,不会的朋友赶快来学习一下吧。

    展开全文
  • 下面是我自己写的一个简单的筛选器,筛选条件可以根据数据包含的字段动态设置。 仿照京东的筛选条件,这里就取价格区间和品牌作为测试。 代码 代码中主要使用js的过滤器Array.prototype.filter,该方法会对数组元素...
  • 基于element-ui封装的一个VUE筛选下拉框
  • layui表格 可搜索过滤 可分页layui表格
  • vue elementui 表格搜索筛选栏组件封装

    千次阅读 多人点赞 2020-01-19 15:35:54
    vue后台管理系统,会有很多表格页面,表格上方会有一些搜索选项,表格直接使用el-table即可,而搜索栏区域每次写起来都很繁琐,而且多人开发情况下每个人写的样式都不相同,布局样式无法统一。 所以要考虑对搜索栏做...
  • 代码完整易懂,可以自己手动分更多层次。没有侧滑效果,是向下打开页面的筛选功能
  • 在win7系统中可以通过关键词或后缀名查询特定的文件,不过有雨林木风win7用户在查找文件时,明明存在这个文件,但是找不到,提示“没有与搜索条件匹配的”,遇到这种问题,可能是搜索服务没有启用,也有可能是这个...
  • 基于layui写的一个高级搜索筛选)功能。 效果图: 是一位萌新,所有写的有点儿乱。(放在上面,供新手们参考,也是自己做一个记录。) 代码如下: <!DOCTYPE ...
  • 前言: 上篇文章是使用 antd@4 table 自定义表头筛选完成一个表格动态列的功能,这次需要完成一个表头联动条件筛选功能。一、开始前开始之前先去 Antd 官网看下「自定义的列筛选功能」的代码和逻辑:插一句:目前我...
  • 由于数据的内容可能有很多,所以仅仅是点选还不够,需要能够对用户的输入进行过滤,即根据用户的输入将某一列与用户输入匹配的数据项筛选保留下来。 实现这一功能需要以下几个步骤: 1.声明一个combogrid 盘...
  • 在浮层中显示出所要查找的内容 通过输入来确定层中是否显示 如没有则不改变其颜色 输入有的话 层中与之对应的改变颜色 输入完成后 锁定层中的相对 然后锁定 点击回车即可搜索
  • 如果在数据筛选时对原始数据进行操作,那么想重置该筛选条件的话,就需要重新获取数据(刷新页面) 不合理,需要实现重置某筛选条件的功能。 组件内部的重置按钮click方法 <el-button size="mini" @click=...
  • PowerApps教程05-记录的搜索筛选

    千次阅读 热门讨论 2020-11-22 16:59:41
    这一讲的目标是要开始数据集的呈现,然后数据集还可以进行搜索、排序等操作,比方说下边的屏幕显示效果 二、准备工作 既然讲到数据,当然前提是有数据源,我们在之前的教程里边讲到,PowerApps支持很多种的数据源,...
  • 易语言超级列表框多关键词筛选源码,超级列表框多关键词筛选,备份表,恢复表
  • Ant Design ProTable 搜索设置默认值

    千次阅读 热门讨论 2021-04-14 18:16:04
    最近遇到一个需求,需要在ProTable搜索框的时间周期设置默认开始时间和结束时间,并调用接口返回数据显示。 实现思路: 创建formRef来设置ProTable里面搜索的默认值; 通过moment来获取当前月的第一天和最后一天; ...
  • excel筛选显示数量

    千次阅读 2020-12-24 11:04:49
    在Excel数据透视表中,也可以对数据进行筛选筛选方法包括标签筛选、值筛选筛选筛选等。筛选时,既可以是单元条件也可以是多条件。在默认条件下只能进行单条件筛选,如果要多条件筛选需要添加筛选图标;添加时...
  • 详情页返回列表页,保留列表页之前的筛选条件 将之前的搜索条件保存到cookie 中,从指定页面(详情页或列表页)返回到搜索条件页面后,从cookie中获取之前存入的参数。 1、发出查询请求前,将参数存入cookie中。 2、...
  • vue + elementui el-table表头 筛选搜索 功能实现
  • 电脑突然出现什么筛选键怎么处理?

    千次阅读 2021-07-06 08:53:43
    利用该功能,用户可以将计算机设置成适合自己习惯的击键速度。1. 设置筛选筛选键的设置方法同粘滞键的设置方法类似,也会在任务栏上显示出一个状态图标,不同之处在于使用快捷方式的方法上。在筛选键中,按住键盘...
  • 简单易用的多样式筛选器(选择控件支持多选和反选,选中或输入任一则有小红点提示标记)
  • QTreeWidget搜索并隐藏不匹配的

    千次阅读 2018-12-19 09:29:33
    QTreeWidget可以呈现出数据的层次关系,有时需要对数据进行筛选,只显示结果,其他隐藏。如下图所示 通过查询QTreeWidget的方法可以看到有个setRowHidden方法可以隐藏行,Qt assistant中说明如下: void ...
  • 概要:通过调研B端后台系统的筛选场景应用,总结归纳了几种基础筛选、高级筛选及组合筛选的场景,基于此对自身产品的筛选场景应用进行分析、归纳最终输出优化设计方案,希望对你有所启发。 一、筛选场景介绍 在B端...
  • select下拉框(支持筛选、多选)

    千次阅读 2021-06-11 14:14:14
    不仅如此,它更扩展了select,增加了自动筛选的功能。它可对列表进行分组,同时也可禁用某些选择。先来看下插件的效果:跟这个比起来,原来的select样式是不是弱爆了!1、先把js和css文件引用到网页里面去:2、...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 51,761
精华内容 20,704
关键字:

如何设置搜索筛选项