vue项目使用element ui

目录

1、创建一个vue项目

2、找到element官网,点击指南,找到安装栏

3、 找到使用包管理器,复制命令

 4、在main.js中引入element

5、使用element ui

6、找到App.vue,导入Button.vue文件,保存启动项目


1、创建一个vue项目

2、找到element官网,点击指南,找到安装栏

一个 Vue 3 UI 框架 | Element Plus

3、 找到使用包管理器,复制命令

npm install element-plus --save

下载完之后打开项目可以看到下载好的element文件

 4、在main.js中引入element

import { createApp } from 'vue'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import App from './App.vue'

const app = createApp(App)

app.use(ElementPlus)
app.mount('#app')

5、使用element ui

创建一个Button.vue文件,在官网找到组件

找到button组件,查看源代码直接复制到Button.vue文件

6、找到App.vue,导入Button.vue文件,保存启动项目

启动成功 

 点击API,可以修改样式属性

 

 

相关推荐

  1. vue2使用elementUI报错

    2024-04-07 13:50:02       37 阅读
  2. Vue如何引入ElementUI使用

    2024-04-07 13:50:02       8 阅读
  3. vue使用elementui组件的的对话框;使用ref

    2024-04-07 13:50:02       12 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-04-07 13:50:02       18 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-04-07 13:50:02       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-04-07 13:50:02       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-04-07 13:50:02       20 阅读

热门阅读

  1. 【微信小程序】开发简介

    2024-04-07 13:50:02       27 阅读
  2. QT 创建线程的几种方法

    2024-04-07 13:50:02       30 阅读
  3. MySQL中的sql优化

    2024-04-07 13:50:02       20 阅读
  4. nginx配置多个服务

    2024-04-07 13:50:02       55 阅读
  5. MySQL 行锁和表锁是什么?区别,作用等学习总结

    2024-04-07 13:50:02       23 阅读
  6. TouchableOpacity和TouchableWithoutFeedback区别

    2024-04-07 13:50:02       17 阅读
  7. 口语 4.7

    2024-04-07 13:50:02       11 阅读