elementUI中修改穿梭框样式-增加头像框

这是elementui中的样式,需要增加这个头像框的效果

通过查看样式结构可以看出这是一个span

将

 <span slot-scope="{ option }">{{ option.key }} - {{ option.label }}</span>

改为下图样式

<div slot-scope="{ option }" style="margin-bottom:10px">
    <el-avatar :size="30" :src="userInfo.avatar | filterUrl" style="vertical-align:middle;"></el-avatar>
    <span> {{ option.label }}-{{ option.phone }}</span>
 </div>

效果就实现了