联级选择联级选择

<el-form-item label="地区选择" prop="areaCode">
   <el-cascader v-model="form.areaCode" :props="props" @visible-change='visibleChange' :options="areaList"  :show-all-levels="false" :placeholder="cityPlaceholder"></el-cascader>
</el-form-item>

      areaList:[],
      props: {
        lazy: true,
        label:"shortName",
        value:"id",
        lazyLoad (node, resolve) {
          let nodes = [];
          if (node.level == 1) {
            getListCityList(node.value).then((res) => {
              nodes = res.data
              resolve(nodes);
            })
          } else if (node.level == 2) {
            getListCityList(node.value).then((res) => {
              nodes = res.data
              resolve(nodes);
            })
          }else if (node.level == 3) {
            getListCityList(node.value).then((res) => {
              nodes = res.data
              resolve(nodes);
            })
          }else if (node.level ==4) {
            getListCityList(node.value).then((res) => {
              nodes = res.data
              nodes.forEach(d=>{
                d.leaf = true;
              })
              resolve(nodes);
            })
          }
        }
      },

visibleChange(e){
      if(e){
        this.areaList=[]
        this.CityList();
      }
    },
    CityList(areaCode=0){
      getListCityList(areaCode).then((res) => {
        this.areaList = res.data
      });
    },