1.创建一个应用实例
每个Vue应用都是通过用createApp函数创建一个新的应用实例开始的。
- 该应用实例是用来在应用中注册“全局”组件的
- 应用实例暴露的大多数方法都会返回该同一实例,允许链式
2.根组件
传递给creatApp的选项用于配置根组件。当我们挂载应用时,该组件被用作渲染的起点。
- 一个应用需要被挂载到一个DOM元素中:例如id=“app”,mount应该传入‘#app’
- mount不返回应用本身,返回根组件实例(vm:ViewModel)
- 大多数真实应用都是被组织成一个嵌套的、可重用的组件树
- 每个组件将有自己的组件实例vm,应用中的所有组件实例将共享同一个应用实例
3.组件实例property
在data中定义的property是通过组件实例暴露的,还有其他组件选项,可以将用户定义的property添加到组件实例中,例如:methods,props,computed,inject,setup。
- 组件实例的所有property,无论如何定义,都可以在组件的模板中访问
- Vue还通过组件实例暴露一些内置property,如emit
4.生命周期钩子
每个组件在被创建时都要经过一系列的初始化过程:设置数据监听、编译模板、将实例挂载到DOM并在数据变化时更新DOM。在这个过程中会运行一些叫做生命周期钩子的函数,给了用户在不同阶段添加自己的代码的机会。
- created钩子:可以用来在一个实例被创建后执行代码
- mounted、updated、unmounted等
- 生命周期钩子的this上下文指向调用它的当前活动实例
- 箭头函数没有this,因此不要再选项property或回调上使用箭头函数