关于ElementUI最好还是通过实践项目来做,来熟悉。

这只是一些ElementUI的注意事项,至此vue2的内容真的全部完结,后面将继续vue3的内容更新。

一.完整引入

一般提及什么什么UI会有两个问题,一个是基于什么框架,一个是移动端还是pc端

各种各样的UI都是基于框架来支撑的,也不用特意去记,需要使用的时候直接参考这个UI官网的使用文档

下载后导入

就可以参考文档想要什么就复制过来了,当一个快乐的cv工程师了。

二.按需引入

上面的导入css是将整个element的css导入进来,use也是将整个elementui的组件注册进来,这样就会导致一个问题,如果我用的比较少,只是单纯用一点,可以看到现在的chunk文件大小

下面我开始按需导入,参考文档,需要安装babel-plugin-component,注意文档里面的 .babelrc 现在是babel.config.js,导入配置

这个时候关键部分来了,你要用什么组件,就在入口文件导入,我们官网复制下来的代码都是el开头,导入就是去除el,并且所有单词首字母大写,多个单词去除-以驼峰命名法

然后开始注册全局组件,可以将前面写为自己自定义的名字,也可以直接写就是el开头默认的组件标签名字

再看现在的体积

vue - ElementUI的更多相关文章

  1. spring boot + vue + element-ui全栈开发入门——开篇

    最近经常看到很多java程序员朋友还在使用Spring 3.x,Spring MVC(struts),JSP.jQuery等这样传统技术.其实,我并不认为这些传统技术不好,而我想表达的是,技术的新旧程 ...

  2. spring boot + vue + element-ui全栈开发入门——基于Electron桌面应用开发

     前言 Electron是由Github开发,用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Electron通过将Chromium和Node.js合并到同一个运行时环 ...

  3. vue+element-ui之tree树形控件有关子节点和父节点之间的各种选中关系详解

    做后端管理系统,永远是最蛋疼.最复杂也最欠揍的事情,也永远是前端开发人员最苦逼.最无奈也最尿性的时刻.蛋疼的是需求变幻无穷,如同二师兄的三十六般变化:复杂的是开发难度寸步难行,如同蜀道难,难于上青天: ...

  4. vue+element-ui实现表格checkbox单选

    公司平台利用vue+elementui搭建前端页面,因为本人第一次使用vue也遇到了不少坑,因为我要实现的效果如下图所示 实现这种单选框,只能选择一个,但element-ui展示的是多选框,check ...

  5. 递归函数 Vue ElementUI

    对树形菜单的递归操作,首先应该对树形菜单数据进行整理,优化成自己需要的类型 比如Vue + ElementUI的动态侧边栏数据 export function routerRoleToPretty ( ...

  6. spring boot + vue + element-ui全栈开发入门

    今天想弄弄element-ui  然后就在网上找了个例子 感觉还是可以用的  第一步是完成了  果断 拿过来  放到我这里这  下面直接是连接  点进去 就可以用啊 本想着不用vue   直接导入连接 ...

  7. vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。

    vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...

  8. VUE + ElementUI 从搭建到运行

    版权声明:本文为博主原创文章,欢迎转载,转载请注明作者.原文超链接 前言:本文简洁的描述VUE + ElementUI 从搭建到运行,可以根据本文先搭建出可运行的项目,然后再详细回顾每个步骤所做的事: ...

  9. vue element-ui 日期选择器组件 日期时间格式化

    vue element-ui 组件开发大大提高了我们的效率,但有时候并不能满足我们的需求,例如时间,日期组件: element-ui 日期返回的格式是这样的,看下图: 但我们要的是另一个格式 , 如下 ...

  10. Java快速开发平台强大的代码生成器,JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布

    JEECG 3.7.5 VUE+ElementUI SPA单页面应用版本发布 此版本为Vue+ElementUI SPA单页面应用版本,提供新一代风格代码生成器模板,采用Vue技术,提供两套精美模板E ...

随机推荐

  1. go http请求如果参数中带有"等特殊字符,参数传输可能会出现问题

    编码完整的URL url.QueryEscape(urlStr) 编码完整的URL 如果我们要对完整的 URL 进行编码呢? 就是PHP中 urlencode() 函数的功能. 在 GO 语言下可以直 ...

  2. vim简明文档

    替换 替换当前行第一个 :s/vivian/sky/ 替换当前行第一个 vivian 为 sky 从当前行替换到最后一行 :%s/vivian/sky/g 替换所有行中 vivian 为 sky 查找 ...

  3. MAPREDUCE实践篇

    1.编程规范 (1)用户编写的程序分成三个部分:Mapper,Reducer,Driver(提交运行mr程序的客户端) (2)Mapper的输入数据是KV对的形式(KV的类型可自定义) (3)Mapp ...

  4. 万事通,专精部分领域的多功能 Transformer 智能体

    介绍 我们很高兴分享"万事通"(Jack of All Trades,简称 JAT) 项目,该项目旨在朝着通用智能体的方向发展.该项目最初是作为对 Gato (Reed 等,202 ...

  5. .NET 采用开源软件OpenOffice 实现文档转码服务(word ppt excel)转PDF

    前言 前几年做了个项目,里面有个需求,需要在浏览器中在线浏览word excel ppt  pdf等文档. 最近又开始研究并记录下来 当时方案: 因为浏览器中阅读文档暂时只能通过pdf方式读取,所以就 ...

  6. Vue History模式IIS的配置补充

    摘自 :https://blog.csdn.net/ssdnif/article/details/103856283 官方提供的配置<?xml version="1.0" e ...

  7. winform 使用Clipboard 和windows Word Com组件 把Html 导出到word

    首先是把Html复制到剪贴板 见:https://www.cnblogs.com/HelloQLQ/p/16289343.html 然后使用: private void saveAsWordCopy( ...

  8. Linux之命令提示符的颜色设置

    1.临时设置 执行下面的命令: export PS1="[\[\e[34;1m\]\u@\[\e[0m\]\[\e[32;1m\]\H\[\e[0m\] \[\e[31;1m\]\w\[\e ...

  9. ajax跨域(跨源)方案之CORS

    ajax跨域(跨源)方案:后端授权[CORS],jsonp,服务端代理 CORS是一个W3C标准,全称是"跨域资源共享",它允许浏览器向跨源的后端服务器发出ajax请求,从而克服了 ...

  10. 网页唤起qq加群

    今天在网上大浪淘沙了一番,90%的教程都是使用的鹅厂官方的加群组件,但是有个致命bug就是这个加群组件只能唤起自己创建的群,这就很尴尬了,后来偶然发现在qq群资料那边就可以直接获取到加群的链接,害得我 ...