1.0.0 • Published 5 years ago

pps-search-tree v1.0.0

Weekly downloads
3
License
ISC
Repository
gitlab
Last release
5 years ago

pc端 树形搜索组件

  • 支持搜索
  • 支持多级树形结构
  • 支持异步加载
  • 支持异步搜索

API

属性说明类型默认值
dataList树形结构数据Array
handleSelect节点点击Function(pos, data)

属性结构格式

// 地点数据格式
// 此处注意格式必须与此数据保持一致
// Title 当前层级标题 Fieds子集数据
const data = [
        {
            "Title": "组织单元",
            "Fieds": [
                {
                    "Title": "五级组织"
                },
                {
                    "Title": "三级组织"
                }
            ]
        },
        {
            "Title": "卡点信息",
            "Fieds": [
                {
                "Title": "补签事由",
                }, 
                {
                    "Title": "卡点类型"
                }
            ]
        }
    ]
代码演示
import React, { Component } from 'react'
import DefaultComponent from 'pps-search-tree'

export default class Index extends Component {
    state = {
        dataList: [
            {
                "Title": "组织单元",
                "Fieds": [
                    {
                        "Title": "五级组织"
                    },
                    {
                        "Title": "三级组织"
                    }
                ]
            },
            {
                "Title": "卡点信息",
                "Fieds": [
                    {
                    "Title": "补签事由",
                    }, 
                    {
                        "Title": "卡点类型"
                    }
                ]
            }
        ]
    }
    /**
     * @param  {} pos   当前点击节点索引
     * @param  {} data  当前展示数据结构
     */
    handleSelect = (pos, data) => {
        
    }


    render() {
        return (
            <div>
                <DefaultComponent dataList={this.state.dataList} onSelect = {this.handleSelect} ></DefaultComponent>
            </div>
        )
    }
}