npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2025 – Pkg Stats / Ryan Hefner

abc-filter-search

v0.0.6

Published

筛选条件因子组件

Readme

说明

安装依赖 yarn add abc-filter-search --save

abc-filter-search组件

组件参数

| 参数 | 说明 | 默认值 | |--|--|--| | themeStyle | 组件主题 | 默认black | | showDateStatus| 是否显示日期选取组件 boolean| 默认true | | type_list| 预警因子数据| [] | | caheFactorTags| 已选取预警因子 | [] | | throughData| 穿透数据 | | emotion_list| 情绪因子数据 | | industryData | 行业数据 | | industryCode | 行业code | | hasFeedBackCount | 反馈数量 | | totalCount | list总数 | | callback | 预警因子选取回调函数 | | setHasFeedbacks | 反馈选取回调 | | caheFactorTagsCallback | 存储已选预警因子回调 | | caheIndustryTagsCallback | 存储已选行业因子回调 | | caheIndustryTags | 存储的行业选中因子 | | filterRequest | 接口请求状态 | | emotion_data | 情绪数据 | | filter_emotion | 默认选中的情绪因子 | | date_range | 默认日期范围 ('day','week','month')| | fetchSearchTagFn | 预警因子搜索回调 | | dataSource | 搜索的预警因子结果 |

组件使用demo

功能: 添加搜索过滤因子

具体使用如下:

  import NewFilterSearch from 'abc-filter-search'

  // 预警因子搜索
  fetchSearchTag(value){
    const self = this;
    let params = {
        wd: value,
        howmany: 5
    }
    ask(url, { params: params }).then(function (response) {
        const res_data = response.data.map((item) => {
            return ({
                content: item.name
            });
        });
        self.setState({
            dataSource: value ? res_data : [],
        });
    });
  }

  // 存储过滤搜索的预警因子
  caheFactorTagsCallback(data) {

      this.setState({
          caheFactorTags: data
      });
  }

  // 存储行业选中的标签
  caheIndustryTagsCallback(data){
      this.setState({
          caheIndustryTags:data
      });
  }

  //  存储图谱穿透选中的标签
  caheThroughTagsCallback(data) {
      this.setState({
          caheThroughTags: data
      });
  }

  //  存储图谱穿透选中的标签
  caheThroughTagsCallback(data) {
      this.setState({
          caheThroughTags: data
      });
  }

  const filterList = [{"type_title":"预警因子","type_id":2,"type_list_item":[{"id":1,"text":"利润增加","num":9212,"checked":false},{"id":2,"text":"营收增加","num":8327,"checked":false},{"id":3,"text":"兼并收购","num":6081,"checked":false},{"id":4,"text":"开展合作","num":5333,"checked":false},{"id":5,"text":"产品创新","num":4035,"checked":false}]}];

  const emotion_list = [{"name":"正面","count":38558},{"name":"负面高","count":405},{"name":"负面中","count":5850},       {"name":"负面低","count":10833},{"name":"中性","count":312871}]

  const industryData  = [{"typeName":"行业","typeId":3,"data":[{"name":"电子","count":9489,"id":"industry_0"},       {"name":"汽车","count":9324,"id":"industry_1"},{"name":"传媒","count":8376,"id":"industry_2"},{"name":"化工","count":10272,"id":"industry_3"},{"name":"银行","count":8020,"id":"industry_4"},{"name":"国防军工","count":1580,"id":"industry_5"},{"name":"食品饮料","count":4573,"id":"industry_6"},{"name":"轻工制造","count":4370,"id":"industry_7"},{"name":"计算机","count":17848,"id":"industry_8"},{"name":"机械设备","count":10398,"id":"industry_9"},{"name":"医药生物","count":10402,"id":"industry_10"},{"name":"通信","count":5338,"id":"industry_11"},{"name":"综合","count":2324,"id":"industry_12"},{"name":"钢铁","count":1141,"id":"industry_13"},{"name":"休闲服务","count":1198,"id":"industry_14"},{"name":"公用事业","count":4814,"id":"industry_15"},{"name":"有色金属","count":4089,"id":"industry_16"},{"name":"电气设备","count":8552,"id":"industry_17"},{"name":"家用电器","count":3467,"id":"industry_18"},{"name":"建筑装饰","count":4383,"id":"industry_19"},{"name":"纺织服装","count":2410,"id":"industry_20"},{"name":"非银金融","count":12312,"id":"industry_21"},{"name":"农林牧渔","count":3667,"id":"industry_22"},{"name":"商业贸易","count":4957,"id":"industry_23"},{"name":"建筑材料","count":2152,"id":"industry_24"},{"name":"采掘","count":3017,"id":"industry_25"},{"name":"交通运输","count":4064,"id":"industry_26"},{"name":"房地产","count":8417,"id":"industry_27"}]}]

  <NewFilterSearch
      themeStyle={'light'}
      filters={filterList}
      hasFeedBackCount = {104}
      totalCount = {383516}
      emotion_list = {emotion_list}
      industryData = {industryData}
      dataSource = {this.state.dataSource}
      caheFactorTags = {[]}
      caheThroughTags = {[]}
      caheIndustryTags = {[]}
      industryCode = {[]}
      filterRequest = {true}
      fetchSearchTagFn = {this.fetchSearchTag.bind(this)}
      callback = {()=>{}}
      caheFactorTagsCallback = {()=>{}}
      caheIndustryTagsCallback = {()=>{}}
      caheThroughTagsCallback={this.caheThroughTagsCallback.bind(this)}

  />