element ui组件中穿梭框内容显示不全解决方式
Posted shanxinxin
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了element ui组件中穿梭框内容显示不全解决方式相关的知识，希望对你有一定的参考价值。
引用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组件中穿梭框内容显示不全解决方式的主要内容，如果未能解决你的问题，请参考以下文章