vue2 使用element ui

Vue 2 与 Element UI 结合使用是为了提供一套丰富的、易于使用的 UI 组件，使得前端开发者能够快速构建高效的界面。Element UI 是基于 Vue.js 的开源 UI 库，它提供了大量的预设组件，如表格、按钮、导航栏、下拉菜单等，覆盖了日常开发中常见的组件需求。

以下是使用 Vue 2 和 Element UI 的基本步骤：

1. **安装依赖**：首先，确保你已经安装了 Vue CLI（Vue脚手架）。然后，在项目中安装 Element UI 和样式文件：

   npm install element-ui --save
   npm install element-ui-icons-vue --save

2. **引入和注册**：在 `main.js` 或 Vue 的入口文件中，引入 Element UI，并注册组件库：

   import Vue from 'vue'
   import ElementUI from 'element-ui'
   import 'element-ui/lib/theme-chalk/index.css'

   Vue.use(ElementUI)

3. **在模板中使用组件**：现在你可以像使用 Vue 的内置组件一样使用 Element UI 的组件了。例如，创建一个导航栏：

   <template>
     <div>
       <el-menu default-active="1" class="site-demo-menu">
         <el-menu-item index="1">首页</el-menu-item>
         <el-menu-item index="2">用户</el-menu-item>
         <el-menu-item index="3">管理</el-menu-item>
       </el-menu>
     </div>
   </template>

4. **配置路由和视图**：根据需要，使用 Vue Router 来管理页面之间的跳转，配合 Element UI 的导航栏组件，可以轻松实现单页应用的导航。