关于vue.js:vueiview中tree树形组件覆盖点击背景色和鼠标移入背景色

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.本期的分享到了这里就完结啦,心愿对你有所帮忙,让咱们一起致力走向巅峰!