element 左菜单过宽处理成省略号

一、如图，使用element以后菜单过宽，字体被遮挡

二、目标：将超出的部分显示为省略号

参考资料：https://blog.csdn.net/Beam007/article/details/84305216

采用方案：通过…表示 鼠标移上去显示全称（其他的自己看资料）

实现逻辑和思路：
1.找到菜单列表里面的节点标签span
2.设置title属性（设置以后鼠标移动上去就会显示title内容）
3.设置span里面的样式（注意span一定要修改成块元素才有效）

实际代码：

// html部分
<span :title="node.label">{{ node.label }}</span>

// 添加css样式
.span-ellipsis {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  display: block; // 一定要是块级元素，并且有定宽才有效果
}