在 scss 中使用变量

问题

之前二次封装了一个树形组件 MenuTree，自定义了节点名。后来优化为：节点名超过一定宽度就显示 toolTip 样式，即：以省略号显示超出部分内容，只有在鼠标悬浮时才会显示完整内容。

现在的需求是：不需要限制节点名的宽度。

因此需要把原来的 width: 100px 修改为 width: xxx节点名称宽度。变量默认为 100px，传递 prop 修改为 100% 则表名不限制节点名宽度。

即：在 scss 中使用变量。

解决

总结

如果要给某个元素设置的样式过多，建议写在计算属性中。

参考链接

vue scss使用data中定义的变量