前端技术系列知识

使用elementUI的NavMenu导航菜单实现锚点导航。主要实现了点击菜单时定位到相应的内容和滚动内容时菜单定位到相应的锚点。$el是获取组件内部DOM元素，在$el中获取offsetTop的值。

在新建的Vue项目中，使用height: 100;设置内容高度，设置的高度一直无效。高度设置为100%时，元素的高度应该和父元素的高度保持一致，因此需要设置html标签和body标签的高度为100%。

主要介绍了Vue中的属性执行顺序和父子组件生命周期的执行顺序。在父组件中，调用接口获取数据后传递给子组件时，由于调用的接口是异步的，所以可能会导致子组件获取不到父组件传递的数据，给出了主要的解决方法。

使用vuex获取用户信息，在每个页面就可以直接使用。1.在src目录下建立store目录，配置文件。2.在store目录下建立userInfo目录，调用用户信息接口。3.store引入。4.获取信息。

Axios接口封装和拦截器设置。axiosConfig.js Axios相关配置。axiosInstance.js Axios实例。 index.js Axios接口封装。 urls.js 接口地址。

prettier是一个前端代码格式化的工具。prettier可以自定义代码规范和规范项目的代码格式。prettier工具的安装步骤：1.安装插件。 2.在根目录添加配置文件。3.文件里面添加相关配置。

使用elementUI中的NavMenu和路由router实现菜单切换功能。 1.路由文件配置。 2.添加页面文件。 3.App.vue文件添加路由出口router-view。4.添加菜单文件并引入。

vue.config.js是一个可选的配置文件，可以对Vue CLI进行个性化的自定义配置。可以通过修改该文件对Vue CLI的内部webpack配置进行修改和扩展，包括webpack的配置项和插件。

目前网上大部分搭建vue项目都是使用脚手架搭建，这样很多配置就不用自己配置了。如果想要熟悉项目的结构和配置，可以手动搭建一个vue项目，既不使用脚手架搭建项目。

当平铺数据转换为树形数据时，转换的关键点在于以下几点： 子节点的parentCode等于父节点的id，有相同parentCode的节点为同一级且拥有同一个父节点，观察树结构发现，每一层都是一样的结构。

递归问题可拆解成若干个子问题，所有子问题的求解方法和大问题的求解方法一样，存在结果已知的最小子问题。即子问题须与原始问题为同样的事，且更为简单。不能无限制地调用本身，须有个出口，化简为非递归状况处理。

数组的filter()方法是创建一个新数组，新数组中的元素是通过检查指定数组中符合条件的所有元素。若没有符合条件的元素则返回空数组。若有符合条件的元素，则将符合条件的元素放入新数组中，并举例介绍方法。

$attrs和$listeners可用于组件间的通信。当父组件给孙组件传递数据时，可在子组件中给孙组件绑定$attrs传值。通过给孙组件添加v-on="$listeners"，孙组件可触发父组件方法。

js操作原生DOM读取文件 注意：reader.onload读取文件是异步的。 Vue读取文件 在这里使用了箭头函数，这样里面的this就是vm对象。使用普通函数this就是FileReader对象。

当平铺数据转换为树形数据时，转换的关键点在于以下几点： 子节点的parentCode等于父节点的id，有相同parentCode的节点为同一级且拥有同一个父节点，观察树结构发现，每一层都是一样的结构。

通过location.search获取了?（包括?）后面的字符串。使用split('&')，将参数字符串转成所有参数组成的数组。Vue中使用this.$route.query获取由所有参数组成的对象。

JSON对象在大括号中书写，对象可包含多个key/value(键/值)对。JSON数组在中括号中书写。JSON.parse(JSON.stringify())实现深拷贝，拷贝的对象修改不会影响原对象。

数据代理是通过一个对象代理对另一个对象中属性的操作（读/写操作）。Vue中的数据代理：通过vm对象来代理data对象中属性的操作（读/写操作）。Vue中数据代理的好处：更加方便的操作data中的数据。

一般情况给对象设置属性的操作，使用这些操作定义的属性可以被枚举、删除、修改。但通过Object.defineProperty()方法定义的属性，可以通过配置描述符来定义属性是否可以被枚举、删除、修改。

生命周期即生命周期回调函数、生命周期函数、生命周期钩子。是Vue在关键时刻调用的一些特殊名称的函数。生命周期函数的名字不可修改，但函数的具体内容是程序员按照需求编写的。其中this指向vm或组件实例。