欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

前端根据关键字进行过滤

程序员文章站 2022-06-27 14:14:19
最近遇到后端返回数据,需要前端进行筛选展示的一个需求 这个是在react中写的方法未命名文件 // 输入框变化时,触发onchange事件,进行数据筛选 changeZons = (e) = { const { zonesList } = this.state; const searchData = ......

最近遇到后端返回数据,需要前端进行筛选展示的一个需求
这个是在react中写的方法未命名文件
前端根据关键字进行过滤

// 输入框变化时,触发onchange事件,进行数据筛选

changeZons = (e) => {
        const { zonesList } = this.state;
        const searchData = [];
        zonesList.forEach((item) => {

            let pass = true;
          if (e.target.value) {
            if (item.jobZone.indexOf(e.target.value) < 0) {
              pass = false;
            }
          }
          if (pass) {
            searchData.push(item);
          }
        });
        this.setState({
          zones: searchData,
        });
    }

    // 下拉菜单变化时,进行数据筛选
    changeZonsAll = (key) => {
        const { zonesList } = this.state;
        const searchData = [];
        zonesList.forEach((item) => {
            let pass = true;
          if (key && key !== 'all') {
            if (item.status.indexOf(key) < 0) {
              pass = false;
            }
          }
          if (pass) {
            searchData.push(item);
          }
        });
        this.setState({
          zones: searchData,
        });
    }