问题：
el-tree只提供了多选功能，如果业务需求是单选，需要我们自己二次开发
解决方法：
第一步：el-tree 配置
<el-tree :data="apiData"
:props="apiViewProps"
ref='apiDataTree'
show-checkbox
node-key="id"
:check-strictly="true"
@check-change="handleCheckChange"
>
</el-tree>
第二步：通过@check-change实现单选
handleCheckChange(data,checked){
const indexs = this.selectOrg.orgsid.indexOf(data.id) // 获取当前选择的id在数组中的索引
// 如果不存在数组中，并且数组中已经有一个id并且checked为true的时候，代表不能再次选择。
if (indexs < 0 && this.selectOrg.orgsid.length === 1 && checked) {
this.$message({
message: '只能选择一个区域！',
type: 'error',
showClose: true
})
// 设置已选择的节点为false 很重要
this.$refs.apiDataTree.setChecked(data, false)
} else if (this.selectOrg.orgsid.length === 0 && checked) {
// 发现数组为空 并且是已选择
// 防止数组有值，首先清空，再push
this.selectOrg.orgsid = []
this.selectOrg.orgsid.push(data.id)
//以下是我要传给后端的参数。
this.apiForm.name = data.name
this.apiForm.api = data.api
} else if (
indexs >= 0 &&
this.selectOrg.orgsid.length === 1 &&
!checked
) {
// 再次直接进行赋值为空操作
this.selectOrg.orgsid = []
}
},
效果图如下：
再选择其他项时，无法选中，并弹窗提示只能选择一个区域
