vue+iview 中 tree 树形组件笼罩点击背景色和鼠标移入背景色
1. 开发环境 vue+iview
2. 电脑系统 windows10 专业版
3. 在应用 vue+iview 开发的过程中, 咱们依据需要会应用到树形组件, 上面我来分享一下, 心愿对你有所帮忙~!
4. 在 template 中增加如下代码:
<Scroll style="width: 100%" height="760">
<Tree
@on-select-change="chentreelick"
:data="treedata"
expand-node
></Tree>
</Scroll>
5. 效果图如下:
留神: 第一个 背景色是鼠标移入的成果, 第二个背景色 是点击之后的成果
6. 咱们会感觉这个款式会比拟难看, 怎么笼罩默认的款式呢? 代码如下:
.ivu-tree-title-selected,.ivu-tree-title-selected:hover{background-color: rgb(81, 97, 187) !important;
}
.ivu-tree-title:hover{background-color: rgb(81, 97, 187) !important
}
7. 笼罩之后的效果图如下:
8. 本期的分享到了这里就完结啦, 心愿对你有所帮忙, 让咱们一起致力走向巅峰!