转载：
vue通信、传值的多种方式（详细）
Vue.js——十分钟入门Vuex
通过路由带参数进行传值
- 两个组件 A和B,A组件通过query把orderId传递给B组件（触发事件可以是点击事件、钩子函数等）
this.$router.push({ path: '/conponentsB', query: { orderId: 123 } }) // 跳转到B - 在B组件中获取A组件传递过来的参数
this.$route.query.orderId
目录
- v-if 和 v-show 区别
- $route和$router的区别
- NextTick 是做什么的
- Vue 组件 data 为什么必须是函数
- 计算属性computed 和事件 methods 有什么区别
- Vue 中怎么自定义过滤器
- 对 keep-alive 的了解
- Vue 中 key 的作用
- vue 等单页面应用的优缺点
- 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: 标准通用标记语言,是现时常用的超文本格式的最高层次标准
###
