vue3如何使用element ui

在 Vue 3 中使用 Element UI 非常简单，因为Element UI 已经支持 Vue 3 的版本。以下是基本步骤：

1. **安装 Element UI**：首先，你需要安装 Element UI 和其对应的 Vue 模块。如果是通过 Vue CLI 创建的项目，可以使用 Vue CLI 的插件安装：

   npm install element-ui@latest vue@next # 或者使用 yarn

2. **引入并注册**：在 `main.js` 文件（或其他入口文件）中，导入 Element UI 并将其添加到 Vue 的全局实例上：

   import { createApp } from 'vue';
   import App from './App.vue';
   import ElementUI from 'element-ui';
   import 'element-ui/lib/theme-chalk/index.css'; // 引入主题样式

   createApp(App).use(ElementUI);

注意：这里的 `createApp` 是 Vue 3 的新引入方法。

3. **使用组件**：现在可以在你的 Vue 组件中开始使用 Element UI 的各种预置组件，如 `<el-button>`、`<el-input>` 等：

   <template>
     <div>
       <el-button type="primary">按钮</el-button>
       <el-input v-model="inputValue"></el-input>
     </div>
   </template>

   <script>
   export default {
     data() {
       return {
         inputValue: ''
       };
     }
   };
   </script>

4. **按需加载**：如果你想只引入你实际使用的组件，而不是所有组件，可以使用 Element UI 的懒加载功能。不过，这通常在大型项目中更为常见。

5. **设置国际化**：如果你需要更改元素的文本语言，可以配置 Element UI 的国际ization (i18n) 功能。