这次介绍的控件相对比较简单,鼠标悬停时显示弹出内容,效果如下:
为了增加灵活性,用 slot 实现,调用时的代码:
服务
控件代码:
name: 'MouseOverPop',
data() { return {
isActive: false };
},
methods: {
mouseEnter() { this.isActive = true },
mouseOut() { this.isActive = false },
},
}
css 代码:
.toolbox-element .element-title{
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
color: #c2c2c2;
font-size: 13px;
padding:5px 5px;
margin:3px;
display: flex;
flex-flow: