elementui-树形控件实现子节点右侧添加图标和数据，鼠标放上去显示文字

本文主要是介绍elementui-树形控件实现子节点右侧添加图标和数据，鼠标放上去显示文字，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1、代码

 <el-treev-loading="nameLoding":data="data"node-key="id":highlight-current="true"empty-text="暂无数据":props="defaultPropsIndex"default-expand-all:filter-node-method="filterNodeIndex"ref="treeName"@node-click="getCheckedNodes"><spanclass="custom-tree-node"slot-scope="{ node, data }"><span>{{ node.label }}</span><span v-if="node.level > 1"><spanstyle="text-align: left;width: 63px;display: inline-block;"><el-tooltipclass="item"effect="dark"content="拥有的指标权限个数"placement="top"><ititle=""class="el-icon-s-marketing"style="color: rgb(103, 194, 58)"></i> </el-tooltip><span style="margin-right: 10%">{{data.num}}</span></span><spanstyle="text-align: left;width: 71px;display: inline-block;"><el-tooltipclass="item"effect="dark"content="拥有的访问权限个数"placement="top"><iclass="el-icon-success"style="color: rgb(103, 194, 58)"></i> </el-tooltip><span style="margin-right: 10%">{{data.sub_num}}</span></span></span></span></el-tree>

css

.custom-tree-node {flex: 1;display: flex;align-items: center;justify-content: space-between;font-size: 14px;/* padding-right: 8px; *//* padding-right: 15%; */
}

效果图：

这篇关于elementui-树形控件实现子节点右侧添加图标和数据，鼠标放上去显示文字的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---