归纳vue的基本知识(一)

vue是一款组件化开发的框架，vue的基础知识,我们了解多少呢?

vue中组件之间的通信方式？

vue组件的通信方式大体有8种：

• props
• $emit / $on(3.0已废弃)
• $children(3.0已废弃) / $parent
• $attrs/ $listeners(3.0已废弃)
• ref
• $root
• eventbus(3.0中实现较为复杂)
• vuex 我们也可以根据组件之间关系进行分类

1. 父子组件

• props
• $emit/$on
• $parent / $children
• ref
• $attrs / $listeners

2. 兄弟组件

• $parent
• eventbus
• vuex 3.跨层级关系
• provide/inject
• $root
• eventbus
• vuex

watch和computed的区别以及选择?

1. computed可以从组件数据返回新数据，最常见的使用方式是设置一个函数，返回计算之后的结果，computed和methods的差异是它具备缓存性，如果依赖项不改变时则不会重新计算。

   watch可以侦测某个响应式数据的变化并执行操作，常见用法是传递一个函数，执行结果，watch是没有返回值的，但可以执行一些复杂的异步操作。

2. computed常用场景是简化行内模板中的复杂表达式，模板中出现太多逻辑会是模板变得臃肿不易维护。

   watch常用场景是状态变化之后做一些额外的DOM操作或者异步操作。选择采用何用方案时首先看是否需要获取 新值，基本能用计算属性实现的方式首选计算属性。

3. 使用过程中有一些细节，比如computed也是可以传递对象，成为既可读又可写的计算属性。

   watch可以传递对象，设置deep(深度监听)、immediate(首次运行是否执行监听)等选项。

4. vue3中watch选项发生了一些变化，例如不能再侦测一个"."操作符之外的字符串形式的表达式； reactivity API中新出现了watch、watchEffect可以完全替代目前的watch选项，且功能更加强大。

Vue的生命周期

Vue生命周期总共可以分为8个阶段：组件创建前后, 组件挂载前后, 组件更新前后, 组件销毁前后，以及一些特殊场景的生命周期。vue3中新增了三个用于调试和服务端渲染场景。