在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ iview表格內(nèi)容,設(shè)置省略后如何顯示title(鼠標(biāo)滑過顯示文本)

iview表格內(nèi)容,設(shè)置省略后如何顯示title(鼠標(biāo)滑過顯示文本)

我在定義表格內(nèi)容時,使用了ellipsis關(guān)鍵詞,使文字溢出后顯示省略號,這個時候如何實現(xiàn)鼠標(biāo)移入顯示全部文字呢?title不知道加在哪里。(css能實現(xiàn)的話我都不犯愁的。。。)
部分表格內(nèi)容配置

  {
    title: '創(chuàng)建人',
    key: 'creatorName',
    ellipsis: true,
    width: '60',
    align: 'center'
  },
  
  

————————————————————————————————————
感謝這位兄臺提供render函數(shù)思路~

順便問一下,在render函數(shù)里寫的點擊事件,如何防止冒泡?
標(biāo)簽中直接@click.prevent.stop=""就可以了,那么render呢?
附上代碼

{
    title: '操作',
    width: '70',
    align: 'center',
    render: (h, params) => {
      return h('a', {
        on: {
          click: () => {
            this.removeItemContent(params.row.id);
          }
        }
      }, '移除');
    }
  },

回答
編輯回答
負我心

使用render函數(shù)

{
    title: '創(chuàng)建人',
    key: 'creatorName',
    width: '60',
    align: 'center',
    render: (h, params) => {
      return h('div', [
         h('span', {
             style: {
                 display: 'inline-block',
                 width: '100%',
                 overflow: 'hidden',
                 textOverflow: 'ellipsis',
                 whiteSpace: 'nowrap'
             },
             domProps: {
                 title: params.row.creatorName
             }
         }, params.row.creatorName)
     ]);
         
   }
}

至于冒泡的話,直接原生JS就可以了;

on: {
    click: (e) => {
        e.stopPropagation();
        this.removeItemContent(params.row.id);
    }
}
2018年3月24日 08:18