目录

  1. v-if 和 v-show 区别
  2. $route和$router的区别
  3. NextTick 是做什么的
  4. Vue 组件 data 为什么必须是函数
  5. 计算属性computed 和事件 methods 有什么区别
  6. Vue 中怎么自定义过滤器
  7. 对 keep-alive 的了解
  8. Vue 中 key 的作用
  9. vue 等单页面应用的优缺点
  10. Doctype作用，HTML5 为什么只需要写 <!DOCTYPE HTML>

Vue.js基础，模块化，单文件组件，路由，与服务器通信，状态管理，单元测试与生产发布，服务端渲染SSR与Nuxt.js，基于Vue.js企业级项目开发(Mint UI, Element UI)等

v-if 和 v-show 区别

使用了 v-if 的时候，如果值为 false ，那么页面将不会有这个 html 标签生成。
v-show 则是不管值为 true 还是 false ，html 元素都会存在，只是 CSS 中的 display 显示或隐藏

$route和$router的区别

$router 为 VueRouter 实例，想要导航到不同 URL，则使用 $router.push 方法
$route 为当前 router 跳转对象里面可以获取 name 、 path 、 query 、 params 等

NextTick 是做什么的

$nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用 $nextTick，则可以在回调中获取更新后的 DOM

Vue 组件 data 为什么必须是函数

因为js本身的特性带来的，如果 data 是一个对象，那么由于对象本身属于引用类型，当我们修改其中的一个属性时，会影响到所有Vue实例的数据。如果将 data 作为一个函数返回一个对象，那么每一个实例的 data 属性都是独立的，不会相互影响了

计算属性computed 和事件 methods 有什么区别

我们可以将同一函数定义为一个 method 或者一个计算属性。对于最终的结果，两种方式是相同的

不同点：

computed: 计算属性是基于它们的依赖进行缓存的,只有在它的相关依赖发生改变时才会重新求值
对于 method ，只要发生重新渲染，method 调用总会执行该函数

Vue 中怎么自定义过滤器

可以用全局方法 Vue.filter() 注册一个自定义过滤器，它接收两个参数：过滤器 ID 和过滤器函数。过滤器函数以值为参数，返回转换后的值
Vue.filter(‘reverse’, function (value) {
return value.split(‘’).reverse().join(‘’)
})


过滤器也同样接受全局注册和局部注册

对 keep-alive 的了解

keep-alive 是 Vue 内置的一个组件，可以使被包含的组件保留状态，或避免重新渲染






可以使用API提供的props，实现组件的动态缓存

Vue 中 key 的作用

key 的特殊属性主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes。如果不使用 key，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试修复/再利用相同类型元素的算法。使用 key，它会基于 key 的变化重新排列元素顺序，并且会移除 key 不存在的元素。
有相同父元素的子元素必须有独特的 key。重复的 key 会造成渲染错误

vue 等单页面应用的优缺点

优点：
良好的交互体验
良好的前后端工作分离模式
减轻服务器压力
缺点：
SEO难度较高
前进、后退管理
初次加载耗时多

Doctype作用，HTML5 为什么只需要写 <!DOCTYPE HTML>

doctype是一种标准通用标记语言的文档类型声明，目的是告诉标准通用标记语言解析器要使用什么样的文档类型定义（DTD）来解析文档.<!DOCTYPE>声明必须是HTML文档的第一行，位于html标签之前
HTML5不基于SGML，所以不需要引用DTD。在HTML5中<!DOCTYPE>只有一种

SGML: 标准通用标记语言,是现时常用的超文本格式的最高层次标准

###