element 樹形結構自定義節點圖標

1. :render-content="renderContent"

      <el-tree :data="treedata" :render-content="renderContent" :props="defaultProps" @node-click="handleNodeClick"></el-tree>

    renderContent(h, { node, data, store }) {
      let name = this.icons[data.type]
      console.log(`@/assets/tree/${name}.png`)
      return (
        <span>
          <span class="fileicon">
            <img src={require(`@/assets/tree/${name}.png`)} />
            <span> {node.label}</span>
          </span>
        </span>
      )
    }

2.使用template

      <el-tree :data="treedata" :props="defaultProps" @node-click="handleNodeClick">
        <template #default="{ node, data }">
          <span class="fileicon"><img :src="require('@/assets/tree/'+icons[data.type]+'.png')" /></span>
          <span>{{ node.label }}</span>
        </template>
      </el-tree>