app.use()
和 app.component()
都用于 Vue 3 中的全局配置,但它们的作用不同:
1. app.use()
-
用途: 用于安装插件或全局配置,如 Vue Router、Vuex、或者自定义插件。
-
语法:
app.use(plugin, options?)
-
示例:
import { createApp } from 'vue'; import App from './App.vue'; import router from './router'; // Vue Router 实例 import store from './store'; // Vuex 实例 const app = createApp(App); app.use(router); // 安装 Vue Router 插件 app.use(store); // 安装 Vuex 插件 app.mount('#app');
在这里,
app.use()
用于安装插件,配置全局功能或中间件。
2. app.component()
-
用途: 用于全局注册组件,这样在任何模板中都可以直接使用该组件。
-
语法:
app.component(name: string, component: Object | Function)
-
示例:
import { createApp } from 'vue'; import App from './App.vue'; import MyComponent from './components/MyComponent.vue'; const app = createApp(App); app.component('MyComponent', MyComponent); // 全局注册组件 app.mount('#app');
在这里,
app.component()
用于全局注册一个组件,使其在应用的任何地方都可以使用。
总结
app.use()
: 用于安装插件或全局功能。app.component()
: 用于全局注册组件。
每个方法有其特定的用途,根据你的需求选择适合的方法来配置 Vue 应用。