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,可以修改样式属性

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/796425.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL复制拓扑1

文章目录 主要内容一.安装MySQL服务器1.MySQL 安装程序和其它文件保存在下发的 mysql8-files.iso 镜像文件中,可以使用虚拟光驱来提取到 Linux 文件系统。代码如下(示例): 2.将 MySQL8.0 程序解压到 /opt 目录,再创建到 MySQL 默认…

闪站侠洗护管理系统,洗衣洗鞋小程序软件定制,干洗连锁店软件系统搭建;

闪站侠洗护管理系统,洗衣洗鞋小程序软件定制,干洗连锁店软件系统搭建; 为了让每一个洗衣洗鞋工厂与门店的连接更加高效便捷,送洗流程更加简单轻松,拽牛科技倾心打造洗衣洗鞋管理软件。我们的目标是通过高效和优质的服务…

双指针(复习)

基本概念 双指针:在区间操作时,利用两个下标同时遍历,进行高效操作 双指针利用区间性质可以把0(n2)时间降低到0(n) 蓝桥532 import os import sys# 请在此输入您的代码 w int(input()) n int(input()) b [] ans 0 for i in range(n):b.append(int(…

复现chatgpt_ros,需要openapi key

1. 前置工作: 现在ubuntu系统是20.04ros1,现在用docker新建并安装ros2: 最简单的,用大佬的一键安装: wget http://fishros.com/install -O fishros && . fishros 其次自己装…

基于沙漏 Tokenizer 的高效三维人体姿态估计框架HoT

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 摘要Abstract文献阅读:基于沙漏 Tokenizer 的高效三维人体姿态估计框架HoT1、研究背景2、提出方法3、模块详细3.1、什么是HoT3.2、HoT 框架3.3、Token 剪…

应用性能分析工具CPU Profiler

简介 本文档介绍应用性能分析工具CPU Profiler的使用方法,该工具为开发者提供性能采样分析手段,可在不插桩情况下获取调用栈上各层函数的执行时间,并展示在时间轴上。 开发者可通过该工具查看TS/JS代码及NAPI代码执行过程中的时序及耗时情况…

JDK安全剖析之安全处理入门

0.前言 Java 安全包括大量 API、工具以及常用安全算法、机制和协议的实现。Java 安全 API 涵盖了广泛的领域,包括加密、公钥基础设施、安全通信、身份验证和访问控制。Java 安全技术为开发人员提供了编写应用程序的全面安全框架,还为用户或管理员提供了…

以Kotti项目为例使用pytest测试项目

在维护和构建大型项目时,单独一个一个手工测试代码已经不适用了,这时候就要用专门的测试框架进行测试。让我们以Kotti项目为例,用pytest这个测试框架进行实践测试吧。 使用python3.10 Ubuntu 系统 准备工作 下载和安装kotti库 pip install…

Flutter 解决NestedScrollView与TabBar双列表滚动位置同步问题

文章目录 前言一、需要实现的效果如下二、flutter实现代码如下:总结 前言 最近写flutter项目,遇到NestedScrollView与TabBar双列表滚动位置同步问题,下面是解决方案,希望帮助到大家。 一、需要实现的效果如下 1、UI图&#xff1…

代码随想录算法训练营三刷day46 | 动态规划之139.单词拆分

三刷day46 139.单词拆分1.确定dp数组以及下标的含义2.确定递推公式3.dp数组如何初始化4.确定遍历顺序5.举例推导dp[i] 139.单词拆分 题目链接 解题思路:单词就是物品,字符串s就是背包,单词能否组成字符串s,就是问物品能不能把背包…

蓝桥杯-DS18B20温度传感器

一.管脚&芯片&寄存器 1.芯片 2.了解封装以及引脚的用法 3.相关寄存器 报警功能 二,如何使能DS18B20芯片 1.初始化芯片&比赛提供的驱动代码 比赛提供的底层驱动代码 /* # 单总线代码片段说明1. 本文件夹中提供的驱动代码供参赛选手完成程序设计参考…

【前沿模型解析】潜在扩散模 1 | LDM第一阶段-感知图像压缩总览

文章目录 0 开始~1 感知压缩的目的2 自回归编码器-解码器生成模型一览2.1 AE 自编码器2.2 VAE 变分自编码器2.3 VQ-VAE2.4 VQ-GAN 3 代码部分讲解总览 0 开始~ 从今天起呢,我们会剖析LDM(潜在扩散模型) 从去年开始,大量的生成模…

【mac操作】brew指令集

brew指令集记录 1. brew search 【软件名称】2. rm -rf $(brew --cache)3. brew install 【软件名】4. brew uninstall 【软件名】5. 未完待续,,,, 官网路径: Homebrew官网 最上面就来一个homebrew安装指令吧&#xf…

三、Jenkins相关操作

Jenkins操作 一、插件管理1.修改公共插件源2.下载中文汉化插件2.1 安装插件2.2 重启2.3 设置为中文 3.远程部署插件 二、用户权限管理1.安装权限插件2.开启权限3.创建角色3.1 Global roles3.2 Item roles 4.创建用户5.给用户分配角色 三、凭证管理四、Git管理1.账号密码方式1.1…

深入浅出 -- 系统架构之Keepalived搭建双机热备

Keepalived重启脚本双机热备搭建 ①首先创建一个对应的目录并下载keepalived安装包(提取码:s6aq)到Linux中并解压: [rootlocalhost]# mkdir /soft/keepalived && cd /soft/keepalived [rootlocalhost]# wget https://www.keepalived.…

【Flutter】Getx设计模式及Provider、Repository、Controller、View等

本文基于Getx 4,x 本本 1、引入 再次接触到Flutter项目,社区俨然很完善和活跃。pubs.dev 寻找状态管理的时候看到很熟悉的Getx时间,俨然发现Getx的版本已到是4.x版本,看到Getx的功能已经非常强大了,庞大的API俨然成为一种开发框架…

c# wpf LiveCharts 简单试验

1.概要 1.1 说明 1.2 环境准备 NuGet 添加插件安装 2.代码 <Window x:Class"WpfApp3.MainWindow"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d"…

基于单片机电子密码锁系统设计

**单片机设计介绍&#xff0c;基于单片机电子密码锁系统设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机电子密码锁系统设计概要主要包括以下几个方面&#xff1a; 一、系统概述 基于单片机电子密码锁系统是一个…

c++11的重要特性2

可变参数模板在3中。 目录 ​编辑 1、统一的列表初始化&#xff1a; std::initializer_list&#xff1a; std::initializer_list是什么类型&#xff1a; std::initializer_list使用场景&#xff1a; 让模拟实现的vector也支持{}初始化和赋值 2、声明 auto decltype nul…

深入浅出 -- 系统架构之分布式多形态的存储型集群

一、多形态的存储型集群 在上阶段&#xff0c;我们简单聊了下集群的基本知识&#xff0c;以及快速过了一下逻辑处理型集群的内容&#xff0c;下面重点来看看存储型集群&#xff0c;毕竟这块才是重头戏&#xff0c;集群的形态在其中有着多种多样的变化。 逻辑处理型的应用&…