El-Tree-Fransfer est un composant de navettes en forme d'arbre basé sur Vue et Element-UI. 此组件功能类似于element-ui
的transfer组件,但是里面的数据是树形结构! En fait, les composants Element-UI dont dépend El-Tree-Transfert est la case à cocher multiple de choix, le bouton du bouton et le contrôle de l'arborescence d'arborescence la plus importante! Ce n'est pas une extension sur le composant de la navette de l'élément-UI, mais référez-vous simplement à son style et à sa fonction d'apparence.
Parce que l'entreprise de l'entreprise utilise le cadre VUE, l'élément-UI utilisé dans les bibliothèques d'interface utilisateur. Il est difficile de trouver un composant de cadre de navette Vue Tree facile à utiliser sur le marché, et ne souhaite pas introduire d'autres plug-ins poids lourds pour l'introduction d'autres plugins poids lourds en dehors de l'élément-UI, il y a donc El-Tree -Transfert. Léger, facile à utiliser, pas besoin d'investir dans d'autres coûts d'apprentissage.
2.4.6 Correction de l'erreur de reconstruction (n'utilisez pas 2.4.0-2.4.5); Algorithme, les performances de test de démo ont amélioré l'amélioration de la sélection, la sélection entière lorsque le père et le fils n'étaient pas associés; Augmenter le vide; augmenter la fonction de navette sans rapport
2.3.3 Modifier la logique de correspondance des navettes; augmenter le paramètre rootpidvalue. Pour plus de détails, consultez les instructions de la version ci-dessous
Premier NPM Télécharger Plug -in
npm install el-tree-transfer --save
ou
npm i el-tree-transfer -S
Ensuite, vous pouvez utiliser El-Tree-Transfert comme des composants ordinaires
< template >
< div >
// 你的代码
...
// 使用树形穿梭框组件
< tree-transfer : title = " title " :from_data='fromData' :to_data='toData' :defaultProps=" { label: 'label' } " @add-btn='add' @remove-btn='remove' :mode='mode' height='540px' filter openAll>
</ tree - transfer >
< / div >
</ template >
< script >
import treeTransfer from 'el-tree-transfer' // 引入
export defult {
data ( ) {
return : {
mode : "transfer" , // transfer addressList
fromData : [
{
id : "1" ,
pid : 0 ,
label : "一级 1" ,
children : [
{
id : "1-1" ,
pid : "1" ,
label : "二级 1-1" ,
disabled : true ,
children : [ ]
} ,
{
id : "1-2" ,
pid : "1" ,
label : "二级 1-2" ,
children : [
{
id : "1-2-1" ,
pid : "1-2" ,
children : [ ] ,
label : "二级 1-2-1"
} ,
{
id : "1-2-2" ,
pid : "1-2" ,
children : [ ] ,
label : "二级 1-2-2"
}
]
}
]
} ,
] ,
toData : [ ]
}
} ,
methods: {
// 切换模式 现有树形穿梭框模式transfer 和通讯录模式addressList
changeMode ( ) {
if ( this . mode == "transfer" ) {
this . mode = "addressList" ;
} else {
this . mode = "transfer" ;
}
} ,
// 监听穿梭框组件添加
add ( fromData , toData , obj ) {
// 树形穿梭框模式transfer时,返回参数为左侧树移动后数据、右侧树移动后数据、移动的{keys,nodes,halfKeys,halfNodes}对象
// 通讯录模式addressList时,返回参数为右侧收件人列表、右侧抄送人列表、右侧密送人列表
console . log ( "fromData:" , fromData ) ;
console . log ( "toData:" , toData ) ;
console . log ( "obj:" , obj ) ;
} ,
// 监听穿梭框组件移除
remove ( fromData , toData , obj ) {
// 树形穿梭框模式transfer时,返回参数为左侧树移动后数据、右侧树移动后数据、移动的{keys,nodes,halfKeys,halfNodes}对象
// 通讯录模式addressList时,返回参数为右侧收件人列表、右侧抄送人列表、右侧密送人列表
console . log ( "fromData:" , fromData ) ;
console . log ( "toData:" , toData ) ;
console . log ( "obj:" , obj ) ;
}
} ,
components : { treeTransfer } // 注册
}
</ script >
< style >
...
</ style >
Numéro de série | paramètre | illustrer | taper | valeur par défaut | Remplir |
---|---|---|---|---|---|
1 | largeur | largeur | Chaîne | 100% | Il est recommandé de définir la largeur et l'emplacement dans la boîte externe |
2 | hauteur | haut | Chaîne | 320px | - |
3 | titre | titre | Chaîne | ["Source List", "Liste cible"] | - |
4 | Button_text | Nom du bouton | Tableau | - | - |
5 | De_data | Données de source | Tableau | - | Le format de données est le composant d'arborescence de même UI, mais il doit y avoir ID et PID |
6 | To_data | Données cibles | Tableau | - | Le format de données est le composant d'arborescence de même UI, mais il doit y avoir ID et PID |
7 | DefaultProps | Configuration des élément de propulse à El-Tree | Objet | {Label: "Label", Enfants: "Enfants", Isleaf: "Leaf", Disable: "Disable"}} | L'utilisation est la même que les accessoires d'El-Tree |
8 | node_key | Valeur de clé nœud personnalisée, ID par défaut | Chaîne | IDENTIFIANT | Il doit être cohérent avec le nom du paramètre ID dans les données Treedata, et il doit être unique |
9 | Piquer | Nom du paramètre du PID personnalisé, le "PID" par défaut | Chaîne | Piquer | Certains internautes ont proposé que le nom de champ donné en arrière-plan n'est pas un PID, il augmente donc le support personnalisé |
10 | leafly | Abandonner | - | - | - |
11 | Filtre | S'il faut allumer la fonction de dépistage | Booléen | FAUX | Filtrez le champ d'étiquette en fonction des paramètres de défaut |
12 | Outall | S'il faut tout développer par défaut | Booléen | FAUX | Existence |
13 | Nœud d'arbre personnalisé, l'utilisation est l'arborescence du même temps | Fonction | - | 2.2.3 Le démontage est démonté en deux fonctions. | |
14 | mode | Définir le mode de la navette | Chaîne | Transfert | Le mode par défaut est le mode de transfert, c'est-à-dire le mode de navette en forme d'arborescence. au carnet d'adresses, au destinataire, à la personne copiée et à l'expéditeur secret |
15 | transfertoperpennode | Si le nœud de navette est élargi après la navette | Booléen | vrai | Le nœud par défaut des navettes consiste à étendre la navette, ce qui est pratique pour la visualisation visuelle. données |
16 | DefaultockedKeys | Sélectionnez le nœud par défaut | Tableau | FAUX | Seul le nœud par défaut est apparié au début, et il ne modifiera pas dynamiquement le nœud par défaut après votre opération |
17 | Espace réservé | Définir l'invite de la zone de recherche | Chaîne | Entrez les mots clés pour le filtrage | - |
18 | DefaultTransfer | S'il faut rouler automatiquement le nœud de DefaultCheckEdKeys par défaut | Booléen | FAUX | Il est utilisé pour répondre aux besoins des utilisateurs qui ne veulent pas diviser les données en Fromdata et Todata |
19 | arraytotree | Que vous puissiez allumer un tableau de dimension et le convertir en une structure en forme d'arbre | Booléen | FAUX | Les données doivent avoir des nœuds racinaires et il n'y aura pas de sections. |
20 | adresse | Élément de configuration du mode de calcul | Objet | {Num: numéro, suffixe: chaîne, connecteur: chaîne} | Num-> Le nombre de communications à droite requis est enregistré, et le champ qui veut coudre après le suffixe 3 par défaut-> étiquette (comme ID, c'est-à-dire que l'ID de ces données est cousu à l'arrière) Connecteur-> connexion (chaîne) par défaut |
vingt-et-un | paresseux | Si vous devez utiliser le chargement paresseux | Booléen | FAUX | El-are est paresseux, à ne pas utiliser en même temps que OpenAll ou par défaut |
vingt-deux | lazyfn | Fonction de chargement paresseux | Fonction | - | Lorsque vous appliquez paresseux, vous devez passer la fonction de rappel. que le rappel vient du côté gauche / droit |
vingt-trois | souligner | Si le nœud de sélection actuel de Gao Liang | Booléen | FAUX | - |
vingt-quatre | Code-fil | Fonction de recherche personnalisée | Fonction | - | Si vous ne passez pas, le filtrage du champ d'étiquette est toujours par défaut selon le paramètre defaultProps |
25 | DefaultExpandedKeys | Node par défaut | Tableau | - | Pour étendre le tableau d'identification de nœud, il prendra automatiquement effet sur les côtés gauche et droit |
26 | Lazyright | 2.2.9 Version L'attribut paresseux ne prend effet que sur l'arborescence de gauche. | Booléen | - | - |
27 | Sjr | Mode d'adresse, définissez les bonnes données de destinataire | Tableau | - | - |
28 | RSE | Le mode d'adresses, définissez la bonne copie de la personne à droite | Tableau | - | - |
29 | MSR | Le mode de carnet d'adresses, définit la droite envoie des données sur le côté droit | Tableau | - | - |
30 | rootpidvalue | Le mode de la navette, la valeur du PID de données du nœud racine, est utilisé pour correspondre à la boucle de sortie, importante | Chaîne, numéro | 0 | - |
31 | vérification | N'est-ce pas lié au père et au fils | Booléen | FAUX | Ce modèle ne prend pas en charge paresseux. Et il y a une différence dans la logique de traitement des côtés gauche et droit des nœuds parents après le nœud vide. Vous souhaitez supprimer l'autorité parentale pour supprimer l'autorité parentale. |
32 | renderafterExpand | Rend-il son nœud de fils après le premier nœud d'arbre? | Booléen | vrai | - |
33 | ExtendOnClickNode | Développez-vous ou réduisez-vous le nœud lorsque vous cliquez sur le nœud | Booléen | vrai | - |
34 | CheckOnClickNode | Sélectionnez le nœud lorsque vous cliquez sur le nœud | Booléen | FAUX | - |
35 | intention | L'indentation horizontale entre les nœuds adjacents, l'unité est du pixel | Nombre | 16 | - |
36 | classe icône | Personnalisez l'icône du nœud d'arbre | Chaîne | - | - |
37 | dragable | S'il faut allumer la fonction de nœud glisser | Booléen | FAUX | - |
38 | Draft | Déterminez si le nœud peut être traîné | Fonction (nœud) | - | - |
39 | Perpétration | Déterminez si le nœud cible peut être placé lors de la traînée | Fonction (dragginode, dropnode, type) | - | Il existe trois types de paramètres de type: `` Prev '', «Inner» et «Next», respectivement, indiquent que placé devant le nœud cible, inséré sur le nœud cible et placé derrière le nœud cible |
40 | Contrôler | Trois modes qui ne sont pas liés au père et au fils: mode d'autorisation d'autorisation, mode de marionnette de marionnette Mode de construction modulaire | Chaîne | Autorisation: Sélectionnez le sous-nœud à gauche pour apporter automatiquement le nœud parent; Le père et le fils purs ne sont pas liés à la navette, mais pour maintenir un arbre complet, la structure de forme ne fait automatiquement que la structure du squelette requise pour épisser les coutures opposées; ; Le côté est nécessaire pour retirer le côté gauche. |
Numéro de série | Nom de l'événement | illustrer | Paramètre de rappel |
---|---|---|---|
1 | add-btn | Événement déclenché lorsque vous cliquez sur le bouton Ajouter (2.4.0 était auparavant addbtn) | Fonction (Fromdata, Todata, OBJ), le mode de transfert de la boîte de navette en forme d'arborescence est 1. Après le mouvement de la gauche, les données de droite après le déplacement, 3. Les touches de nœud en mouvement, les nœuds, les demi-cuits, les objets Halfodes; Le modèle est la liste des bons destinataires, la liste de droite à droite, la liste de l'expéditeur secret à droite |
2 | Supprimer | Événement déclenché lorsque vous cliquez sur le bouton de suppression (2.4.0 a été supprimé avant) | Fonction (Fromdata, Todata, OBJ), le mode de transfert de la boîte de navette en forme d'arborescence est 1. Après le mouvement de la gauche, les données de droite après le déplacement, 3. Les touches de nœud en mouvement, les nœuds, les demi-cuits, les objets Halfodes; Le modèle est la liste des bons destinataires, la liste de droite à droite, la liste de l'expéditeur secret à droite |
3 | Vérifier la gauche | Événement de vérification des données source de gauche | Fonction (NodeObj, TreeObj, CheckAll) Voir la valeur de retour de l'événement de vérification du composant El-Tree, ajoutez un nouveau paramètre CheckAll pour indiquer si la sélection entière est sélectionnée |
4 | Changement de vérification de droite | Événement de vérification des données cible droit | Fonction (NodeObj, TreeObj, CheckAll) Voir la valeur de retour de l'événement de vérification du composant El-Tree, ajoutez un nouveau paramètre CheckAll pour indiquer si la sélection entière est sélectionnée |
5 | Nœud-drag-start | Événement déclenché lorsque le nœud commence à glisser | Un total de 3 paramètres sont les suivants: "gauche" / "droite", nœud, événement correspondant aux nœuds de traînée |
6 | nœud-drag-inter- | Faire glisser et glisser dans d'autres nœuds déclenchés | Un total de 4 paramètres, à son tour: "gauche" / "droite", nœud correspondant aux nœuds glisser, nœud, événement correspondant aux nœuds entrant |
7 | niveau de nœud | Traîner loin d'un certain événement de nœud déclenché | Un total de 4 paramètres, à son tour: "gauche" / "droite", nœud correspondant aux nœuds de glisser, nœud, événement correspondant aux nœuds de congé |
8 | Nœud-drag-over | Événement déclenché pendant le nœud de traînée (similaire à l'événement de souris du navigateur) | Un total de 4 paramètres, à son tour: "gauche" / "droite", nœud correspondant aux nœuds, nœuds et événements de glisser correspondant aux nœuds actuels entrant |
9 | nœud-drag-end | À la fin de la traînée (peut ne pas être infructueuse) déclenchée | Un total de 5 paramètres, à son tour: "gauche" / "droite", nœud correspondant au nœud glisser, le nœud (peut être vide) à la fin du nœud de glisser, la position de positionnement du nœud glisser intérieur), événement |
10 | nœud | L'événement déclenché lorsque la traînée est terminée avec succès | Un total de 5 paramètres, à son tour: "gauche" / "droite", nœud correspondant au nœud glisser |
Numéro de série | nom | illustrer |
---|---|---|
1 | closécarqué | 清除选中节点,默认清除全部type:string left左边right右边all全部默认all |
2 | schémas | Obtenir des données sélectionnées |
3 | coché | Définissez la fonction de données sélectionnée (LeftKeys = [], RightKeys = []) |
4 | Clearfilter | Effacer les exigences de la zone de recherche, effacez toutes les fonctions (type: chaîne) gauche à droite droite tout le par défaut tous |
Numéro de série | nom | illustrer |
---|---|---|
1 | foresteur gauche | Fente sur le côté gauche du cadre de la navette et le bas du côté droit |
2 | Footteur droit | Fente sur le côté gauche du cadre de la navette et le bas du côté droit |
3 | Titre-gauche | Contenu personnalisé sur le côté gauche et droit de la zone de titre du cadre de la navette |
4 | Titre à droite | Contenu personnalisé sur le côté gauche et droit de la zone de titre du cadre de la navette |
5 | formulaire | Fente sur la partie supérieure de la zone de contenu à gauche |
6 | à | Fente dans la partie supérieure de la zone de contenu à droite |
7 | contenu à gauche | Node d'arbre gauche personnalisé |
8 | Contenu | Nœud d'arbre droit personnalisé |
2.4.6 Correction de l'erreur de reconstruction (n'utilisez pas 2.4.0-2.4.5); Algorithme, les performances de test de démo ont amélioré l'amélioration de la sélection, la sélection entière lorsque le père et le fils n'étaient pas associés; Augmenter le vide; augmenter la fonction de navette sans rapport
2.3.3 Changement pour déterminer si la cible de la navette a existé du côté opposé pour éviter les résultats d'importance inattendus réguliers STR originaux (tels que les deux champs des enfants et la liste. Les données sont toujours là. Pour le moment, la logique de correspondance originale d'origine will still be the task target that has existed opposite and ignores the shuttle); increase
rootPidValue
field, and no longer force the PID of the root node to 0 to 0 to 0
2.3.2 Mode d'enregistrement de communication optimisé
2.3.1 Réglez la couche extérieure sur les paramètres CSS d'El-Tree dans la couche intérieure, éliminez les effets de 2.3.0 pour annuler l'effet de CSS ScopeEd
2.3.0 Annuler CSS ScopeEd
2.2.9 Version L'attribut paresseux ne prend effet que sur l'arborescence de gauche.
2.2.8 Optimiser la par défaut de DefaultChedKeys et DefaultTransfer pour déclencher le problème de l'ajout d'événements. ) Fonctionne manuellement après le changement de DefaultOchededKeys.
2.2.6 增加
clearChecked
清空选中节点方法
2.2.5 增加参数
defaultExpandedKeys
默认展开节点
2.2.3 拆分自定义树节点函数
参数13 renderContent
为renderContentLeft,renderContentRight
分别定义左右两侧自定义节点函数;增加filterNode
函数来自定义搜索
2.2.2 Ajouter des paramètres de surbrillance
2.2.1 增加title处的全选事件,具体参数说明见
事件3,事件4
2.2.0 增加lazy懒加载功能(非通讯录模式),具体参数说明见
参数21, 参数22
2.1.2 增加通讯录模式的可配置项,但作为非主要维护模式灵活度仍较低,具体参数说明见
参数20
2.1.1 修复array 数组模式选择根节点穿梭错误,废弃
leafOnly
参数,注意已经是树结构的不要使用arrayToTree 参数
2.1.0 Augmentez le paramètre Arraytotree et traitez la transformation automatique du réseau unidimensionnel dans la structure de l'arborescence requise (voir le paramètre 19, ou github-app.vue); Retirez les variables inutiles pour éliminer les pièces
2.0.2 Ajouter la zone de titre du titre de titre du titre de titre
2.0.1 Correction du problème de non lié au père et au fils.
2.0.0 La version augmente le côté gauche du cadre de la navette et les données de droite à droite.
1.9.8 版本修复自定义按钮
button_text
的报错。
1.9.7 版本增加
defaultTransfer
属性用来满足用户不想将数据拆分成fromData 和toData 的需求,增加placeholder
属性。
1.9.0 L'ID amélioré a à la fois les chiffres et la force de correspondance régulière lorsque le caractère est caractérisé.
1.8.9 Réparer un nœud n'est pas seulement une branche d'un côté, mais aussi l'erreur en double causée par les nœuds de navette de l'autre côté! Résoudre les erreurs non valides lorsque le nom du nœud personnalisé est résolu.
1.8.8 版本增加
transferOpenNode
参数用来管理穿梭后是否展开节点,defaultCheckedKeys
用来设置初始时默认展开节点。
1.8.7 版本增加通讯录模式,可通过mode 字段配置模式,mode 字段可选值为
transfer
|addressList
。
1.7.7 版本
addBtn
和removeBtn
事件参数调整,返回三个参数,第一个参数是移动后的fromData 数据,第二个参数是移动后的toData 数据,第三个参数是{keys, nodes, harfKeys, harfNodes}对象。增加renderContent
参数支持树节点自定义。
1.6.7 版本增加
filter,openAll
参数,来设置是否开启筛选和是否默认展开全部
1.5.9 版本增加
leafOnly
参数,来设置是否只返回树的末端叶子节点
1.5.8 版本恢复上个版本莫名删掉的返回
nodes
的代码,如果您的项目只需要穿梭的node-key 值则无需更新! Excuser. Essence Essence
1.5.7 Version Réparation Sub-Component Les données asynchrones ne mettent parfois pas à jour! Correction d'une erreur du nom du paramètre personnalisé Node_key, enfants, et a automatiquement remplacé le PID de la première couche de données à 0
1.4.9 La version ajoute un paramètre de rappel du bouton d'addition et de suppression.
1.4.8 La version résout le problème selon lequel l'ID n'est pas le type de nombre ne peut pas passer la fonction de test scolaire répétée, mais il est toujours recommandé d'utiliser le type de chaîne
1.4.7 版本增加了
defaultProps
参数,node_key
参数,pid
参数,主要作用为可以自定义一些重要字段名,来提高数据灵活性,避免和后台因为字段名不同而被祭天
La version 1.3.7 a annulé la dépendance à la bibliothèque Loadsh.
参数: width
说明:宽度
类型: String
必填: false
默认: 100%
补充:建议在外部盒子设定宽度和位置
参数: height
说明:高度
类型: String
必填: false
默认: 320px
参数: title
说明:标题
类型: Array
必填: false
默认: ["源列表", "目标列表"]
参数: button_text
说明:按钮名字
类型: Array
必填: false
默认:空
参数: from_data
说明:源数据
类型: Array
必填: true
补充:数据格式同element-ui tree组件,但必须有id和pid
参数: to_data
说明:目标数据
类型: Array
必填: true
补充:数据格式同element-ui tree组件,但必须有id和pid
参数: defaultProps
说明:配置项-同el-tree中props
必填: false
补充:用法和el-tree的props一样
参数: node_key
说明:自定义node-key的值,默认为id
必填: false
补充:必须与treedata数据内的id参数名一致,必须唯一
参数: pid
说明:自定义pid的参数名,默认为"pid"
必填: false
补充:有网友提出后台给的字段名不叫pid,因此增加自定义支持
- (abandonné) Il n'est pas recommandé de l'utiliser!参数: leafOnly
说明:是否只返回叶子节点
类型: Boolean
必填: false
补充:默认false,如果你只需要返回的末端子节点可使用此参数
参数: filter
说明:是否开启筛选功能
类型: Boolean
必填: false
参数: openAll
说明:是否默认展开全部
类型: Boolean
必填: false
参数: renderContent
说明:自定义树节点
类型: Function
必填: false
补充:用法同element-ui tree
Parameter: mode
description:设置模式,字段可选值为transfer|addressList
type: String
must fill in: false
supplement: mode默认为transfer模式,即树形穿梭框模式,可配置字段为addressList改为通讯录模式,通讯录模式时按钮不可自定义名字,如要自定义标题名在title数组传入四个值即可,addressList模式时标题默认为通讯录、收件人、抄送人、密送人
Parameter: transferOpenNode
Description:穿梭后是否展开穿梭的节点
type: Boolean
must fill in: false
supplement:默认为true即展开穿梭的节点,便于视觉查看,增加此参数是因为数据量大时展开会有明显卡顿问题,但注意,如此参数设置为false则穿梭后不展开,毕竟无法确定第几层就会有庞大数据
参数: defaultCheckedKeys
说明:默认展开节点
类型: Array
必填: false
补充:只匹配初始时默认节点,不会在你操作后动态改变默认节点
参数: placeholder
说明:设置搜索框提示语
类型: String
必填: false
补充:默认为请输入关键词进行筛选
参数: defaultTransfer
说明:是否自动穿梭一次默认选中defaultCheckedKeys的节点
类型: Boolean
必填: false
补充:默认false,用来满足用户不想将数据拆分成fromData和toData的需求
Parameter: arrayToTree
Note:是否开启一维数组转化为树形结构
Type: Boolean
must fill in: false
supplement:数据必须存在根节点,并且不会断节,数据格式详见github上app.vue,根据id、pid对应关系转化,存在一定的性能问题
参数: addressOptions
说明:通讯录模式配置项{num: Number, suffix: String, connector: String}
类型: Object
必填: false
补充: num-> 所需右侧通讯录个数,默认3 suffix-> label后想要拼接的字段(如id,即取此条数据的id拼接在后方)默认suffix connector -> 连接符(字符串)默认-
参数: lazy
说明:是否启用懒加载
类型: Boolean
必填: false
补充:默认false,效果动el-tree懒加载,不可和openAll或默认展开同时使用
参数: lazyFn
说明:懒加载的回调函数
类型: Function
必填: true
补充:当适用lazy时必须传入回调函数,示例:lazyFn='loadNode',返回参数loadNode(node, resolve, from), node->当前展开节点node,resolve->懒加载resolve,from -> left|right 表示回调来自左侧|右侧
Event: addBtn
description:点击添加按钮时触发的事件
: function(fromData,toData,obj),树形穿梭框transfer模式分别为1.移动后左侧数据,2.移动后右侧数据,3.移动的节点keys、nodes、halfKeys、halfNodes对象;通讯录addressList模式时返回参数为右侧收件人列表、右侧抄送人列表、右侧密送人列表
Event: removeBtn
description:点击移除按钮时触发的事件
: function(fromData,toData,obj),树形穿梭框transfer模式分别为1.移动后左侧数据,2.移动后右侧数据,3.移动的节点keys、nodes、halfKeys、halfNodes对象;通讯录addressList模式时返回参数为右侧收件人列表、右侧抄送人列表、右侧密送人列表
Event: left-check-change
Note:左侧源数据勾选事件
callback parameter: function(nodeObj, treeObj, checkall)见el-tree组件check事件返回值,新增第三个参数表示是否全部选中
事件: right-check-change
说明:右侧目标数据勾选事件
回调参数: function(nodeObj, treeObj, checkall)见el-tree组件check事件返回值,新增第三个参数表示是否全部选中
Slot: left-footer
, right-footer
说明:穿梭框左侧、右侧底部slot
Slot: title-left
, title-right
说明:穿梭框标题区左侧、右侧自定义内容