7005.element-ui组件

文章目录

1 Element-ui 组件安装
- 1.1 官网地址
- 1.2 安装element-ui依赖包
- 1.3 导入element-ui资源
- 1.4 添加element-ui的组件代码
- 1.5 vue.config.js 配置如下
2 自动创建element-ui

1 Element-ui 组件安装

1.1 官网地址

Element-UI:一套基于2.0的桌面端组件库

https://element.eleme.cn/#/zh-CN

1.2 安装element-ui依赖包

npm i element-ui -S

1.3 导入element-ui资源

main.js 中导入资源

import ElementUI from ‘element-ui’
import ‘element-ui/lib/theme-chalk/index.css’

vue.use(ElementUI)

1.4 添加element-ui的组件代码

粘贴代码到项目中app.vue文件

 <el-row><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>
</el-row>

运行项目

nmp run serve

结果如下

1.5 vue.config.js 配置如下

设置服务器端口以及从终端直接打开浏览器项目

module.exports = {
devServer : {
port:8888,
open:true
}
}

2 自动创建element-ui

按需求导入，减少项目的体积

7005.element-ui组件相关推荐

Element UI 组件库分析和二次开发（一）
我的本地开发环境:M1 芯片Mac,node v12.22.10. 一.Element UI 组件库二次开发的大致流程 1. 从 Element 官方 clone 一份 dev 源码到本地 2. 安装 ...
Element ui 组件中用键盘事件
//这是表单 <el-form:model="ruleForm"status-icon:rules="rules"ref="ruleForm&q ...
Element UI组件介绍
简介 element ui 就是基于vue的一个ui框架,该框架基于vue开发了很多相关组件,方便我们快速开发页面. 1.安装Element UI,通过vue脚手架创建项 vue init webpa ...
解决vue-admin-template插件element UI组件默认英文改中文
其实vue-admin-template这个框架原来就有的 1.element UI里的组件改中文模式如图: src/main.js: 2.第三方插件如tinymic这个富文本插件改成中文显示,上面方 ...
Vue引入第三方Element UI 组件
Element UI 官网地址: 各种基于Vue.js的各种UI组件 https://element.eleme.cn/#/zh-CN/component/quickstart https://ele ...
element ui 组件踩坑记录--后台管理系统-最全
说明:很久没有开发过后台管理系统,elementui都好久没有用过了,踩了一些小坑,特意记录下: element 特点:a.组件的一般输入的值/可以选择的值,都是绑定在v-model 上面 b. 在组 ...
Element ui 组件库使用技巧。
按需引入 babel文件配置. 配置 babel.config.js文件可以创建一个js 特意来存放我们需要的 element 组件. 在main.js 文件中全局引入上面存放组件的 js ...
element ui组件的element.style怎么改？
比如抽屉(el-drawer)的element.style的width 方法1:修改element组件自带的属性 <el-drawer size="60%"> 如果没有 ...
element UI 组件封装--搜索表单（含插槽和内嵌组件）
组件封装–搜索表单 searchForm.vue 可根据需要,参考姓名和工作自行增加更多常用的默认搜索项 <template><div style="padding: 30 ...
Vue Element UI 组件化之背景图组件
step1:创建背景图组件 bg.vue 该组件实现: 1.背景图可以自适应屏幕宽度(高度足够适应,不考虑高度) 2.背景图位置固定,不会产生滚动条 3.背景图高度足够高(1920*4092),可以自 ...

7005.element-ui组件

文章目录

1 Element-ui 组件安装

1.1 官网地址

1.2 安装element-ui依赖包

1.3 导入element-ui资源

1.4 添加element-ui的组件代码

1.5 vue.config.js 配置如下

2 自动创建element-ui

7005.element-ui组件相关推荐

最新文章

热门文章