学习之前请确保已经学习了 “3小时学会Vue3”

本套课程配套视频 “40分钟学会ElementPlus”

ElementPlus 官网

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

安装

       npm install element-plus --save

代码

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

	//整体导入 ElementPlus 组件库
	import ElementPlus from 'element-plus' //导入 ElementPlus 组件库的所有模块和功能 
	import 'element-plus/dist/index.css' //导入 ElementPlus 组件库所需的全局 CSS 样式

	import App from './App.vue'

	const app = createApp(App)
	app.use(ElementPlus) //将 ElementPlus 插件注册到 Vue 应用中
	app.mount('#app')

demo\src\App.vue
    <script setup>

    </script>

    <template>
        <h3>按钮</h3>
        <el-button>默认按钮</el-button>
        <el-button type="primary">主要按钮</el-button>
        <el-button type="success">成功按钮</el-button>
        <el-button type="info">信息按钮</el-button>
        <el-button type="warning">警告按钮</el-button>
        <el-button type="danger">危险按钮</el-button>

        <hr>
        <h3>按钮属性</h3>
        <el-button plain>朴素按钮</el-button>
        <el-button round>圆角按钮</el-button>
        <el-button circle>圆</el-button>
        <el-button disabled>禁用按钮</el-button>
        <el-button loading>加载中</el-button>

        <hr>
        <h3>尺寸</h3>
        <el-button size="large">大型按钮</el-button>
        <el-button>默认按钮</el-button>
        <el-button size="small">小型按钮</el-button>
    </template>

    <style scoped>

    </style>