项目场景(如图)：

这是常见的一种权限设置 即：参数只有city，那么只有对应city的权限，----------- 成都就只能查成都的数据 再加一个county="武侯区"的话，那么就只能查“武侯区”及其下属的数据，不能再查成都的数据了。

问题描述：

要完成这个功能，要明确两点： (1) JS 获取地址栏参数，操作完后 最好return 成一个 object，这样方便判断 (2) 由于在此种业务场景下，页面一加载，就应该结合 地址栏参数来做 if 判断，达到下图的效果， 那么，在请求回来一整份 全省树形结构的数据时，该如何优雅地操作数据呢？

解决方案：

1.关于获取地址栏参数：

方案一： （纯原生JS）

//获取地址栏参数
    UrlSearch() {
      let href = window.location.href;
      let qindex = href.indexOf("?");
      let queryParams = href.substr(qindex + 1);

      let queryParamsArr = queryParams.split("&");

      let queryParamsObj = {};
      queryParamsArr.map((v) => {
        let tmp = v.split("=");
        queryParamsObj[tmp[0]] = decodeURIComponent(tmp[1]);
      });

      return queryParamsObj;
    },
    
    console.log(this.UrlSearch) 打印出需要的对象

方案二： （最简单，是不是忘了 vue-router了？ this.$route 里面有你想要的，最开始没想到）

2. 处理 树形数据，不同的地市权限，获取对应地市的数据展示

后端返回------- 原始树形数据举例：大概是这个样子的，city=“全省”的话就是返回全省的

{
    label: "乐山",
    value: 0,
    children: [
      {
        label: "乐山市市中区",
        value: 0,
        children: [
          {
            label: "嘉州城南分局",
            value: 0,
            children: 0,
          },
          {
            label: "嘉州城中分局",
            value: 0,
            children: 0,
          },
          。。。。。。
        ],
      },
  },
  。。。。。。

核心代码：（不用递归）

handleMap() {
      let arr = 请求回来的全省数据;
      let filter = this.UrlSearch();  上面提到的 获取到 地址栏参数的 对象
	  
      let out_data = []; 代表 分条件输出的数据
      let copy_data = JSON.parse(JSON.stringify(arr));
	  
	  如果地址栏 只有一个参数
      if (filter.city) {
        copy_data.map((v) => {
          if (v.label == filter.city) {
            out_data = v.children;
          }
        });

        let obj = [
          {
            label: filter.city,
            value: 0,
            children: out_data,
          },
        ];

        this.options = obj;
        console.log(obj);
      }
	  
	  如果地址栏 有两个参数
      if (filter.county) {
        copy_data = JSON.parse(JSON.stringify(out_data)); 这一步是最妙的，避免了递归，代表“拷贝一份上一次的 out_data”
        copy_data.map((v) => {
          if (v.label == filter.county) {
            out_data = v.children;
          }
        });

        let obj = [
          {
            label: filter.county,
            value: 0,
            children: out_data,
          },
        ];

        this.options = obj;
      }
	  
	  如果地址栏 有三个参数
      if (filter.branch) {
        copy_data = JSON.parse(JSON.stringify(out_data));
        copy_data.map((v) => {
          if (v.label == filter.branch) {
            out_data = v.label;
          }
        });

        let obj = [
          {
            label: filter.branch,
            value: 0,
            children: 0,
          },
        ];

        this.options = obj;
        console.log(obj);
      }
    },

总结：

1. 从地址栏获取参数，除了原生的方法，还可以用 vue相关的
2. 不一定每个树形结构数据都需要递归操作来达到要求，跟具体的业务相关