1.js 的map方法遍历多层级数组

这里我们是为了得到适用于 el-tree的数据结构，将每一层的字段名字进行重构，但是不改变数据结构，已适用于 tree 的字段要求

可以看到，map 的里面是可以接着用 map 的，相当于外层 map 的返回值的 children 属性是里层 map的返回值那个数组！

async initData() {
  let res = await queryRegionSubCampusListV2();
  let result = [];
  result = res.data.map(e => {
    if (e.childList) { //有可能没有 childlist，所以要判断一下！
      let tempList = e.childList.map(e2 => {
        return { //里层 map 返回的数组
          id: e2.campusId,
          label: e2.campusName,
          children: e2.childs
        };
      });
      return {
        id: e.campusId,
        label: e.campusName,
        children: tempList //用于外层的 children 属性
      };
    } else {
      return {
        id: e.id,
        label: e.userName,
        children: e.childList
      };
    }
  });
  console.log(result);
  this.dataList = result;
},

2.解决git 提交时，大小写文件名导致本地文件和远程文件拉取提交出错

可能是本地有缓存记录（但是本地项目中没有相关文件，远程可能也有记录），导致不能直接从远程删除不需要的文件，并且一直报奇怪的错误！

我们先把冲突的文件拷贝一份（防止丢失），然后丢弃更改（这时候本地文件应该变了，我们用拷贝的去替换），然后再移除不需要的文件，提交，然后推送即可！（要善于利用丢弃和移除操作，在 sourceTree 中，但是前提是已经对文件进行了复制）

注意：文件丢弃更改和移除都会导致文件彻底丢失，无法找回！所以一定要备份才可以！

3.vue 中的 data 里面不能出错

data里面的数据不能有任何错，否则会导致后面的属性都未定义，data 里面属性的定义是拦截式的，但是即便出错了 data 里面的错并不会报，而是会报奇怪的错（与未定义的 data 有关的），所以一定保证 data不能出错！

4.react可以在 state里面用this.，但是 vue 不能在 data 里面用

5.Vue路由this.route.push跳转页面不刷新

注意：产生这个问题的大概率原因是因为用了keep-alive，也可以把 keep-alive去掉试试！

**介绍：**在vue项目开发中，使用路由进行页面跳转时，路由所跳转的页面不进行刷新。

也就是vue生命周期函数没有执行(created、mounted钩子函数)。

问题：

当在A页面第一点击按钮到B页面时，一切正常，当返回到A页面再次点击按钮时，B页面没有执行mounted钩子函数，结果导致mounted函数中查询方法不执行。

解决方法：

1.方法一：使用activated:{}周期函数代替mounted:{}函数即可

activated 钩子函数？

activated不是Vue的标准生命周期钩子函数。但是它的执行时期和用法类似于mounted钩子函数。

activated和deactivated是Vue中的keep-alive组件的扩展钩子函数，用于处理组件在缓存中被激活和离开时的操作。keep-alive是一个抽象组件，用于缓存动态组件，以便在切换时保留它们的状态，从而提高性能。

当组件通过keep-alive被缓存时，会触发activated钩子函数，表示组件被激活并重新显示在页面上。而当组件从keep-alive缓存中移除时，会触发deactivated钩子函数，表示组件被离开并不再显示在页面上。

• 适合处理在组件被缓存后重新激活时需要执行的操作。
• 通常用于执行每次激活组件时都需要执行的操作。

示例：

export default {
  activated() {
    console.log('Component activated.');
    // 在这里处理每次组件被激活时需要执行的操作
  }
}

根据需要选择使用mounted或activated钩子函数。**如果组件不使用keep-alive缓存，或者不需要处理缓存重新激活的情况，则可以继续使用mounted钩子函数。**如果组件使用了keep-alive并且需要在重新激活时执行一些操作，则可以使用activated钩子函数。

2.方法二：<router-view :key="$route.fullPath" />，这样切换路由就会刷新重新挂载一下！

3.方法三：监听路由：

（1）

// 不推荐、用户体验不好
watch: {
	'$route' (to, from) {
    // 路由发生变化页面刷新
		this.$router.go(0);
	 }
},

（2）或者：

// 该方法会多一次请求
watch: {
	'$route' (to, from) {
    // 在mounted函数执行的方法，放到该处
    this.qBankId = globalVariable.questionBankId;
    this.qBankName = globalVariable.questionBankTitle;
    this.searchCharpter();
	}
},

6.this.$router.push路由跳转，刷新参数消失

this.$router.push({name:"",params:{id:""}})

name和params搭配刷新参数会消失

this.$router.push({path:"",query:{id:""}})

path和query搭配，刷新页面参数不会消失，query中参数成了url中的一部分

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。