7.安装和配置ElementPlus
-- 未经授权禁止转载 --

element-plus 官网

     https://element-plus.org/zh-CN

安装
	npm install element-plus --save

src\main.js
	import { createApp } from 'vue'
	import App from './App.vue'

	//路由
	import router from './router' //导入路由模块

	//整体导入 ElementPlus 组件库
	import ElementPlus from 'element-plus' //导入 ElementPlus 组件库的所有模块和功能 
	import 'element-plus/dist/index.css' //导入 ElementPlus 组件库所需的全局 css 样式
	import * as ElementPlusIconsVue from '@element-plus/icons-vue' //导入 ElementPlus 组件库中的所有图标
	import zhCn from 'element-plus/dist/locale/zh-cn.mjs' //导入 ElementPlus 组件库的中文语言包


	const app = createApp(App)

	app.use(router) //将 Vue Router 插件注册到 Vue 应用中

	//注册 ElementPlus 组件库中的所有图标到全局 Vue 应用中
	for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
	    app.component(key, component)
	}
	app.use(ElementPlus, { //将 ElementPlus 插件注册到 Vue 应用中
	    locale: zhCn // 设置 ElementPlus 组件库的区域语言为中文简体
	})

	app.mount('#app')

src\views\admin\login.vue
	<script setup>

	</script>

	<template>
	    <h3>登录页</h3>

	    <el-icon><User /></el-icon>

	    <hr>

	    <el-button type="primary">登录</el-button>
	</template>

	<style scoped>

	</style>


  • 状态: 已完结
  • 课程价格: 158
  • 课时数量: 52 节课