/** * 级联 * * @Author: Shann * @LastEditors: Shann * @Date: 2021-08-04 09:48:49 * @LastEditTime: 2021-08-04 11:00:19 * @Copyright: Copyright 2021-2021, all rights reserved. Essa.cn */ class Cascader { props = { options: Array, }; state = { options: [], menus: [], }; constructor() { this.state.options = this.flatten(this.props.options); } flatten(array, level = 1) { let elements = []; array.forEach((element) => { element.level = level; elements.push(element); if ( typeof element.children !== "undefined" && element.children.length > 0 ) { elements = elements.concat( this.flatten(element.children, level + 1) ); } }); return elements; } handleFocus() { this.state.menus.push(this.props.options) } handleBlur() { this.state.menus = []; } handleExpand(value) { let current = this.state.options.filter( (item) => item.value === value )[0]; if (this.state.menus.length > current.level) { this.state.menus.splice(current.level); } if ( typeof current.children !== "undefined" && current.children.length > 0 ) { this.state.menus.push(current.children); } } }