enhanced el treeダウンロード - enhanced el treeソースコードのダウンロード

enhanced el tree

その他のカテゴリー

1.0.0

ダウンロード

強化されたエルツリー

element-ui のツリーコンポーネントをベースに、便利な機能とhorizontal-modeを追加します。

先物

水平モード

または、マルチカスケードコンポーネントとも言えます。デモを試してください。

制限： horizontal modeを使用する場合、一部のオリジンツリープロパティ（例:インデント、アコーディオンなど）は効果がありません。

追加の属性

属性	説明	タイプ	受け入れられる値	デフォルト
水平	水平モードを有効にするかどうか	ブール値	-	間違い
ツリーノードラッパークラス	水平モードをアクティブにするときに、これらのクラスを水平ブロックラッパーに追加します。	弦	-	-
チェック時に開く	チェックボックスをクリックすると、ツリーノードをクリックしたように動作します	ブール値	-	間違い

特別に役立つメソッド

名前	説明	パラメータ
getAllCheckedKeys	`getCheckedKeys`と似ていますが、不定のノードが含まれます
getAllCheckedNodes	`getCheckedNodes`と似ていますが、不定のノードが含まれます
setCheckedNodes正確に	通常、ツリーの元の状態を復元するために`getAllCheckedNodes`とともに使用されます。	`getAllCheckedKeys`から取得したノードの配列
setCheckedKeysを正確に設定する	通常、ツリーの元の状態を復元するために`getAllCheckedKeys`とともに使用されます。	`getAllCheckedKeys`から取得したキーの配列
getCheckedKeysWithoutChild	すべての子のチェック済みノードを除くチェック済みノードを取得します。以下の例を見てください。
getCheckedNodesWithoutChild	同上

getCheckedKeysWithoutChild例:

 /**
 *
 * @example
 *  level1 - intermediate
 *    level1.1 - checked
 *      level1.1.1 - checked
 *      level1.1.2 - checked
 *    level1.2 - checked
 *    level1.3 - intermediate
 *      level1.3.1 - checked
 *      level1.3.2 - not checked
 *    level1.4 - not checked
 *  level2 - checked
 *
 *  getCheckedKeysWithoutChild() will return [level2, level1.1, level1.2, level1.3.1]
 */

インストール

$ npm install @xlaoyu/enhanced-el-tree -D

使用法

 < template >
  < enhanced-el-tree horizontal > </ enhanced-el-tree >
</ template >

< script >
import EnhancedElTree from '@xlaoyu/enhanced-el-tree' ;

// component constructor
{
  name : 'FooComponent' ,
  components : {
    EnhancedElTree
  }
}
</ script >