app.use()和app.component()的区别？

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 应用。