码迷,mamicode.com
首页 > 其他好文 > 详细

element ui组件中穿梭框内容显示不全解决方式

时间:2020-07-09 12:14:26      阅读:293      评论:0      收藏:0      [点我收藏+]

标签:引用   load   导出   new   span   filter   ret   tar   col   

引用element ui时,很多组件自带的样式并不能满足功能需求,比如穿梭框数据内容过长,如下:

技术图片

 

 

 解决方式有两种:

1.改变穿梭框的宽度,在工程中全文搜索.el-transfer-panel,找到定义这个类的地方,修改宽度。

2.鼠标移入数据时显示完整数据,用穿梭框的render-content属性。

<new-transfer ref="quickbom" :moveable=true target-order="push" :render-content="renderFunc" style="text-align: left; display: inline-block" v-model="transfervalueBOM" filterable :titles="[‘全选(可选属性)‘, ‘全选(导出属性)‘]" :format="{
                    noChecked: ‘${total}‘,
                    hasChecked: ‘${checked}/${total}‘
                  }" @change="handleChangeBOM" :data="transferdataBOM">
  </new-transfer>
renderFunc(h,option){
      return <span title={option.label}>{option.label}</span>
    },

element ui组件中穿梭框内容显示不全解决方式

标签:引用   load   导出   new   span   filter   ret   tar   col   

原文地址:https://www.cnblogs.com/shanxinxin/p/13272687.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!