elementUI实现三级级联实现，不可以选中问题

1.前端的html代码

	<el-form-item label="农产品类别">
						<!-- <el-select filterable style="width: 220px;" v-model="dataForm.categoryName" default-first-option
							filterable allow-create clearable size="small" placeholder="选择商品一级分类"
							@change="changeSubCategory" >
							<el-option v-for="(item,index) in this.parentCategoryList" :key="index" :label="item.label"
								:value="item.value" />
						</el-select> -->

						<el-cascader
						filterable
						:show-all-levels="false"
					    size="small"
						clearable
						v-model="dataForm.categoryIds"
						:options="options"
						:props="props"
						@change="handleChange"
						@getCheckedNodes="getCheckedNodes">
						<!-- 自定义显示的列 -->
						<template slot-scope="{ node,data }">
						
							<span>{{data.categoryId}}、{{ data.categoryName}}</span>
						</template>
					</el-cascader>

					</el-form-item>

2.vue的data里面需要定义的代码

options: [{
          value: 'zhinan',
          label: '指南',
          children: [{
            value: 'shejiyuanze',
            label: '设计原则',
			children:[{
				value:"",
				lable:""
			}]
		}]
			}],

				parentCategoryList: [],
				subOptions1: [],
				subOptions: [],
				flag: false,
				props: {
		expandTrigger: 'hover',
        //multiple:true,          //这里设置为多选模式
        value: "categoryId",
        label: "categoryName",      //展示的lable名字
        children:"categories"    //展示子级
      },

3.methods里面代码

			methods: {
				handleChange(value) {
        console.log("",value);
		console.log("选中的值：",this.dataForm.categoryIds)
      },
	  getCheckedNodes(leafOnly){
		console.log("选中节点数组",leafOnly)
	  },
showCategorires() {
					console.log("3333333333333333333")
					var userId =getCookieValue("userId");
					var url2 = baseUrl + "index/categorylist";
					axios({
						method:"post",
						data:userId,
						url:url2,

					}).then(res => {
						console.log("商品分类数据111111111111：",res.data.data);

						this.categorydataList = res.data.data;
						this.options = this.getTreeData(res.data.data);
						this.options.children = res.data.data.categories;
						this.options.value = res.data.data.categoryId;
						this.options.label = res.data.data.categoryName;
						
						
						
						console.log(this.options, "----------CategoriesdataList")

				


					})
				},

				  //递归判断列表，把最后的children设为undefined
				  getTreeData(data){
      for(var i=0;i<data.length;i++){
        if(data[i].categories.length < 1){
          // children若为空数组，则将children设为undefined
          data[i].categories = undefined;
        }else {
          // children若不为空数组，则继续 递归调用 本方法
          this.getTreeData(data[i].categories);
        }
      }
      return data;
    },
}

4.递归方法getTreeData用于解决选不中问题，把所有没有的数据设置为undefined.

参考文章