系统使用的是iview的UI,内部没有input提示的组件,所以......
效果:
代码:
// html
<i-Input
icon="md-help-circle"
:onKeypress="$trim"
placeholder="请输入取值范围"
v-model="innerInfo.elementValue"
clearable
></i-Input>
// css样式
.ivu-icon-md-help-circle:hover {
cursor: pointer;
}
.ivu-icon-md-help-circle:hover:after{
content:"多个以'、'隔开";
padding: 6px 8px;
color: #fff;
text-align: left;
text-decoration: none;
word-wrap: break-word;
background-color: rgba(0, 0, 0, 0.75);
border-radius: 4px;
-webkit-box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
position: absolute;
width: 124px;
line-height: 25px;
}