elinput内容过长显示悬浮框_vue element el-input 输入框当内容长度超出时显示el-tooltip提示...

基于el-input与el-tooltip进行二次封装,当el-input 输入框当内容长度超出时显示el-tooltip提示,支持所有el-input的配置与事件。效果如图:

输入内容长度未超过输入框

输入内容长度超过输入框

组件代码如下(ts写法)

1

2

3

4

5 ref="input"

6 v-model="inputValue"

7 v-bind="$attrs"

8 v-on="$listeners"

9 @input="onInput"

10 >

11

12

13

14 import { Component, Vue, Model, Emit, Watch } from "vue-property-decorator";

15 /**

16 *

17 * el-input组件增强,当文字内容过长超过输入框宽度时,移动上去会浮动显示输入内容

18 *

19 * 用法和el-input一样

20 *

21 */

22 @Component({

23 name: "ZbTipInput"

24 })

25 export default clas

你可能感兴趣的:(elinput内容过长显示悬浮框_vue element el-input 输入框当内容长度超出时显示el-tooltip提示...)