前端基础知识2

1、vue生命周期

 2、keep-alive的理解

keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染。 实际项目中,需要配合vue-router共同使用。如果只想 router-view 里面某个组件被缓存，可以增加router.meta 属性

会比平常的组件多两个生命周期钩子函数，分别是：activated 和 deactivated。使用 keep-alive 包裹的组件在切换时不会被销毁，而是缓存到内存中并执行 deactivated 钩子函数，再次渲染后会执行 activated 钩子函数。

3、created和mounted在实际过程中都用来做什么？

mounted和created都是vue对象生命周期的钩子函数，执行时机不同。

1、created 是在 data配置项的数据挂载到vue对象本身后，会调用的钩子函数。 用 this. 的方式可以拿到data里的数据。 但是数据还没有渲染到模板上。created：通常用于初始化某些属性值，发送网络请求。

 2、mounted是在组件的模板初次渲染完毕后会调用的钩子函数。 此时， data里的数据已经渲染到模板上了。mounted：通常在初始化页面完成后，对html的dom节点进行需要的操作

4、vue中data函数里面的属性值修改完对应的视图会不会立即重新渲染？

 1. 当数据属于基本类型时 ， vue会自动检测并在页面重新渲染

2. 如果数据是引用类型 ， 数据改变无法引起页面重新渲染

2.1如果数据是数组,解决方法是合并数组到新数组中

2.2如果数据是对象,解决方法是使用Vue的set方法

5.nextTick()使用场景

作用:为了在数据变化之后等待 Vue 完成更新 DOM，可以在数据变化之后 立即使用 Vue.nextTick(callback)。这样回调函数将在 DOM 更新完成后被调用。

使用场景:  1.获取数据更新之后的DOM
                  2.created()中进行DOM操作
                  3.获取元素宽度

6.computed和watch的区别

computed 是计算属性，依赖其他属性计算值，并且 computed 的值有缓存，只有当计算值变化才会返回内容。

watch 监听到值的变化就会执行回调，值没有缓存,在回调中可以进行一些逻辑操作。

7.watch里面不同类型的数据对监听来说会有区别吗? 

会有区别,watch监听复杂数据类型需要深度监听.

8.v-for在使用过程中需要注意什么?

1.v-for和v-if建议不要同时使用.

因为v-for比v-if优先级高，如果遍历的数组元素个数比较多，但是满足v-if条件比较少的情况下。会浪费性能。而且，每次刷新页面时，都会执行这样性能不高的代码。

解决方法:可以在computed里循环数组，通过filter的方式，过滤出需要的数据。v-for直接循环计算属性的结果（不用v-if）。而computed是有缓存的，所以，在原始数据没有变化时，不会多次过滤数据，这样,就提高了效率。

2.需要绑定一个key值以给vue一个提示，便于跟踪每个节点的身份而不是重用和重新排序现有元素。并且，key值是唯一的。