Giter VIP home page Giter VIP logo

filter's Introduction

Filter

简介

一款通用的筛选组件,支持单选,复选,多级筛选,筛选联动,筛选数据懒加载

设计思路

我们可以把所有筛选项抽象成一棵树,每个筛选节点抽象成一个FilterNode,他的父节点为一个FilterGroup,最后的根节点为FilterRoot,构建一棵筛选树。每个Node仅对外暴露displayName、isSelected两个属性。选中或反选节点后,将改事件从parent抛到root节点,然后向下遍历所有节点,设置所有节点的isSelected,刷新整棵筛选树。

优点:

  1. 逻辑层与UI层解耦,UI不关系筛选逻辑,仅需根据筛选树的状态刷新UI
  2. 可通过配置的方式构建筛选树,支持任意层级的筛选结构

预览

image

filter's People

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.