安装

npm 安装

推荐使用 npm 的方式安装，它能更好地和 webpack 打包工具配合使用。

npm i element-ui -S

CDN

目前可以通过 unpkg.com/element-ui 获取到最新版本的资源，在页面上引入 js 和 css 文件即可开始使用。

<!-- 引入样式 --> <link rel="stylesheet" 
href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

<!-- 引入组件库 --> <script src="https://unpkg.com/element-ui/lib/index.js"></script>

我们建议使用 CDN 引入 Element 的用户在链接地址上锁定版本，以免将来 Element 升级时受到非兼容性更新的影响。锁定版本的方法请查看 unpkg.com。

Hello world

通过 CDN 的方式我们可以很容易地使用 Element 写出一个 Hello world 页面。在线演示

<!DOCTYPE html>

<html>

<head>

  <meta charset="UTF-8">

  <!-- import CSS -->

  <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">

</head>

<body>

  <div id="app">

    <el-button @click="visible = true">Button</el-button>

    <el-dialog :visible.sync="visible" title="Hello world">

      <p>Try Element</p>

    </el-dialog>

  </div>

</body>

  <!-- import Vue before Element -->

  <script src="https://unpkg.com/vue/dist/vue.js"></script>

  <!-- import JavaScript -->

  <script src="https://unpkg.com/element-ui/lib/index.js"></script>

  <script>

    new Vue({

      el: '#app',

      data: function() {

        return { visible: false }

      }

    })

  </script>

</html>

01 - Element的更多相关文章

  1. DOM4J介绍与代码示例【转载】

    DOM4J是dom4j.org出品的一个开源XML解析包.Dom4j是一个易用的.开源的库,用于XML,XPath和XSLT.它应用于Java平台,采用了Java集合框架并完全支持DOM,SAX和JA ...

  2. DOM4J介绍与代码示例

    DOM4J是dom4j.org出品的一个开源XML解析包.Dom4j是一个易用的.开源的库,用于XML,XPath和XSLT.它应用于Java平台,采用了Java集合框架并完全支持DOM,SAX和JA ...

  3. NetBpm XML解读（5）

    原文: nPdl的翻译 在看NetBPM的nPdl文档时做了个翻译,一来是让自己能更好的理解nPdl,二来是希望能得到关心NetBPM的同志的指导.    由于对工作流不熟悉,所以有不少术语翻译没有把 ...

  4. 解析和操作XML文件

    Dom4j工具 使用步骤: 1)导入dom4j的核心包. dom4j-1.6.1.jar 2)编写Dom4j读取xml文件代码 1,Domj4读取xml文件 ,准备工作:读取整个文档并获取根节点 // ...

  5. 【干货分享】前端面试知识点锦集01（HTML篇）——附答案

    一.HTML部分 1.浏览器页面有哪三层构成,分别是什么,作用是什么? 构成:结构层.表示层.行为层分别是:HTML.CSS.JavaScript作用:HTML实现页面结构,CSS完成页面的表现与风格 ...

  6. Leetcode:378. Kth Smallest Element in a Sorted Matrix

    题目: Given a n x n matrix where each of the rows and columns are sorted in ascending order, find the ...

  7. js DOM Element属性和方法整理

    节点操作,属性 1. childNodes.children 这两个属性获取到的子节点会根据浏览器的不同而不同的,所以一定要判断下nodeType是否为1. childNodes获取到的是NodeLi ...

  8. [转载]Extjs中的dom,Ext.Element和Ext.Component对象的关系

    原文地址:http://www.cnblogs.com/lwzz/archive/2011/01/30/1948106.html   Ext.Element对象是对dom对象的封装,目的是为了跨平台以 ...

  9. [转]W3C 验证 there is no attribute target for this element

    http://validator.w3.org/ 本文转自:http://hi.baidu.com/linkbestlove/item/d7fff865aefa5f0ba1cf0f04 我们要在新窗口 ...

随机推荐

  1. [转帖]什么是UWB？UWB有什么用？

    什么是UWB?UWB有什么用? https://www.sohu.com/a/224891573_531173 小米碰传 就是 UWB吧? 2018-03-05 17:02 UWB在早期被用来应用在近 ...

  2. Python列表生成式测试

    print('*'*50) list1 = list(range(1,6)) print(list1) del(list1) #range(1,20) 按顺序生成列表 list1 = [] for x ...

  3. Python11之列表2（获取、删除列表元素、列表分片、拷贝）

    一.获取列表元素值 列表名 [ 索引值 ] 注:索引值从0开始 nameList = ['詹姆斯','字母哥','乐福','威少','乔治','戴维斯'] nameList[0] '詹姆斯' name ...

  4. LINUX驱动笔记 目录

    笔记参考了宋宝华老师的<Linux设备驱动开发详解:基于最新的Linux 4.0内核>以及韦东山老师的嵌入式驱动教程 笔记开发环境: 单板:第一章到第八章使用TINY4412-1611:第 ...

  5. An unavoidable detour for home CodeForces - 814E (dp)

    大意: 给定一棵树每个点的度数, 求所有满足条件的树的个数 每个点到$1$的最短路唯一 假设$l_i$为点$i$到$1$的最短距离, 那么$l_i\ge l_{i-1}$ 每个点度数范围$2\le d ...

  6. hdu 6625 three array (01-trie)

    大意: 给两个数组$a,b$, 要求重排使得$c_i=a_i\oplus b_i$字典序最小. 字典树上贪心取$n$次, 然后排序, 还不知道怎么证. #include <iostream> ...

  7. 优先队列问题 get it !!

    首先 队列的基本用法 头文件 #include<queue> priority_queue < int/string/struct> q//  q为队列的名字 基本操作 q.p ...

  8. hdu 2353 n皇后问题

    Problem Description 在N*N的方格棋盘放置了N个皇后,使得它们不相互攻击(即任意2个皇后不允许处在同一排,同一列,也不允许处在与棋盘边框成45角的斜线上.你的任务是,对于给定的N, ...

  9. VS.NET(C#)--2.3良构的XHTML

    良构的XHTML 1.关闭所有标签 2.禁止标签嵌套 3.区分大小写 4.引号  所有属性值都要置于引号中 5.唯一的根元素<html></html> 6.保留字符 XML中五 ...

  10. python之函数基本使用

    函数的定义: 函数是一段具有特定功能的.可重用的语句组,用函数名来表示并通过函数名进行功能调用. 使用函数主要有两个目的:降低编程难度和代码重用. python定义一个函数是通过使用def保留字的方式 ...