| vue2 | vue3 |
|---|---|
| 选项式Api | 组合式Api |
与script setup语法糖搭配使用,setup中导入的顶层变量和函数能够在模板中直接使用;你可以理解为模板中的表达式和 <script setup> 中的代码处在同一个作用域中。 |
应用实例
通过createApp创建一个应用实例
import { createApp } from 'vue'
const app = createApp({/* 根组件选项 */})
app就是一个应用实例
根组件
createApp接收的对象就是一个根组件实例
import { createApp } from 'vue'
// 从一个单文件组件中导入根组件
import App from './App.vue'
const app = createApp(App)
App就是一个根组件实例
挂件应用
<div id="app"></div>
app.mount('#app')
应用实例需要在调用了mount()函数之后才会渲染出来,mount()函数接收一个dom元素或者是一个css选择器
mount()函数返回的是一个根组件实例而非应用实例
应用配置
.config
设置应用级别的选项 例如应用级别的错误处理器,捕获所有子组件的错误
app.config.errorHandler = (err) => {
/* 处理错误 */
}
.component
注册全局组件
app.component('TodoDeleteButton', TodoDeleteButton)