element-ui tree控件使用问题汇总

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了element-ui tree控件使用问题汇总相关的知识,希望对你有一定的参考价值。

参考技术A tree控件中,如果显示的内容想要换行,则可以通过slot-scope进行自定义。
里面添加想要展示的内容。并可以在dom元素上添加想要添加的属性和样式。

element-ui使用select组件和tree组件实现下拉树形选择器

参考技术A

一个三级嵌套就可以搞定

网上的办法大多都是直接在option上写,给option加一个高度,然后overflow: auto,这样会有问题, 因为select本身使用的是element-ui自己的滚动条组件, max-height为274px,一旦option设置高度过大,会出现双重滚动条,而且原生滚动条真的有点丑,其实这里只需要给option加一个height: auto,就可以使用select自带的滚动条,不需要单独再加其他滚动。

发现两个问题

要解决几点

scrollToOption?拿来吧你

很明显,要传入一个option对象,而option的$el属性是一个dom,则表现形式就是一个Vue的实例,我这边直接用querySelector获取一个dom, 传入 $el: dom 也能用。再然后就是找这个dom,发现当树某一节点被点击时,其class会多一个is-current,那么就可以这样写:

ps: 只针对单选做的,多选还需按照情况改。

以上是关于element-ui tree控件使用问题汇总的主要内容,如果未能解决你的问题,请参考以下文章

vue使用Element-ui使用el-tree控件实现模糊搜索

Element-ui中tree树形控件全选与取消全选的功能实现

Element-ui 中树形控件(Tree)实现增删改功能

elementui 后台管理系统遇到的问题(二) 树形控件 el-tree

elementui 后台管理系统遇到的问题(二) 树形控件 el-tree

关于element-ui的tree树形组件的bug