ant-design a-tree 改造

需求：将树后面增加提示信息，如下图

 在a-tree上新增如下代码

<template slot="title" slot-scope="item">
  <div style="display:flex; flex-direction: row;">
    <div >{{item.title}}</div>
    <div class="api-method" style="">{{item.tsxx}}</div>
  </div>
</template>

<a-tree
  :checkable="false"
  :multiple="false"
  @select="onSelect"
  @check="onCheck"
  @rightClick="rightHandle"
  :selectedKeys="selectedKeys"
  :checkedKeys="checkedKeys"
  :treeData="departTree"
  :checkStrictly="checkStrictly"
  :expandedKeys="iExpandedKeys"
  :autoExpandParent="autoExpandParent"
  show-icon
  showLine
  @expand="onExpand">
   <template slot="title" slot-scope="item">
     <div style="display:flex; flex-direction: row;">
       <div >{{item.title}}</div>
       <div class="api-method" style="">{{item.tsxx}}</div>
     </div>
   </template>

  </a-tree>

.api-method {
  color: #f5f5f5;
  width: 20px;
  height: 20px;
  background: #f70325;
  border-radius: 10px;
  line-height: 20px;
  text-align: center;
  margin-left: 5px;
}

treeData的数据源每个节点都新加 scopedSlots: { title: 'title' } }属性，如下图