iview 实现鼠标移入显示省略的多余数据信息

阅读数：101

 

定义一个全局变量在data中，实现title属性内容的动态化

 

ttaskOffice:'',

 

在table  table  columns

 

{

title: '工作任务',

key: 'taskOffice',

ellipsis:true,

width: 300,

render: (h, params) => {

return ('div', [

h('span', {

attrs: {

title: this.ttaskOffice

},

on: {

mouseenter: () => {

//实现点击用户姓名然后显示其电话号码等功能，原来是通过动态路由，现在直接写在model里面

let currenIndex = params.index;

var obj = this.managePlanList[currenIndex];

let mouseId = obj.taskOffice;

this.ttaskOffice=mouseId;

}

}

}, params.row.taskOffice)

 

])

}

}

 

 

attrs: {

title: this.ttaskOffice

},

实现设置title属性

然后在onmouseenter中实现title的赋值，将created初始化查询出来的值赋值给刚才定义的全局变量ttaskOffice，这样就可以实现功能呢，亲测可以的哟