element中Tree树形组件使用render-content自定义样式,修改tree最底层样式

对接接口后，最底层节点的样式想要展示多个数据如何展示，使用renderContent
代码如下：

<template>
 <el-tree
            :data="Tree"
            show-checkbox
            node-key="id"
            ref="treevioce"
            default-expand-all
            :expand-on-click-node="false"
            :filter-node-method="filterNode"
            :render-content="renderContent"
            @check-change="handleCheckChange"
          />
</template>

<script>
 renderContent(h, { node, data, store }) {
      if (node.childNodes.length === 0) { //当孩子节点为0的时候则为最底层
        return (
          <div class="custom-tree-node">
            <span style="font-size:14px;width: 200px;height: 100px;">
            <span>张三&nbsp;&nbsp;834758347&nbsp;&nbsp;嘎嘎嘎</span>
          </div>
        );
        // <p  style="font-size:12px">消防分队队长</p>
      } else if (node.childNodes.length > 0) { //不是最底层的节点正常显示
        return (
          <span class="custom-tree">
            <span>{node.label}</span>
          </span>
        );
      }
    }
<script>

效果如图：