el-select与el-tree嵌套树结构单选；el-tree懒加载无子级数据时去掉下拉箭头

在使用Element UI的el-select组件与el-tree组件嵌套时，可以通过自定义el-tree的节点来实现树结构的单选功能，并且在懒加载无子级数据时去掉下拉箭头。

以下是一个简化的实现示例：

<template>
  <el-select v-model="selectedValue" @change="handleSelectChange">
    <el-option :value="selectedValue">
      <el-tree
        :data="treeData"
        :props="defaultProps"
        :load="loadNode"
        lazy
        @node-click="handleNodeClick"
        class="custom-tree"
      ></el-tree>
    </el-option>
  </el-select>
</template>
 
<script>
export default {
  data() {
    return {
      selectedValue: null,
      treeData: [
        { id: 1, label: '节点1', loading: false }
      ],
      defaultProps: {
        children: 'children',
        label: 'label'
      }
    };
  },
  methods: {
    handleSelectChange(value) {
      // 当选项变化时，更新对应的树节点
      this.selectedValue = value;
    },
    handleNodeClick(data, node, component) {
      // 节点点击事件，更新选中状态
      this.selectedValue = data.id;
      // 可以在这里进行数据请求更新等操作
    },
    loadNode(node, resolve) {
      // 懒加载数据的示例函数
      if (node.level === 0) {
        return resolve([{ id: 1, label: '节点1', loading: false }]);
      }
      // 模拟异步加载子节点
      setTimeout(() => {
        const childNodes = [
          { id: `child_${node.data.id}`, label: `子节点${node.data.id}`, leaf: node.level >= 2 }
        ];
        // 通过resolve传递子节点数据
        resolve(childNodes);
      }, 1000);
    }
  }
};
</script>
 
<style>
/* 去掉无子级节点的下拉箭头 */
.custom-tree .el-tree-node__expand-icon.is-leaf {
  display: none;
}
</style>

在这个示例中，el-select的v-model绑定了selectedValue，它代表当前选中的节点ID。el-tree通过lazy属性开启懒加载模式，并通过load方法加载子节点。handleNodeClick方法用于更新选中的节点，并可以在其中执行进一步的逻辑，例如数据请求。

CSS部分定义了一个自定义类.custom-tree，用于在el-tree节点为叶子节点时隐藏下拉箭头。这样就实现了嵌套el-select和el-tree的树结构单选功能，并且在懒加载无子级数据时去掉了下拉箭头。