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

41次阅读

共计 545 个字符,预计需要花费 2 分钟才能阅读完成。

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

正文完
 0