vue的ui库使用Element UI,纯html页面,不使用webpack那玩意
使用手册访问:https://cloud.tencent.com/developer/doc/1270
第一步:在head添加样式
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> 第二步:在html代码之后加
<!-- 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> 注意:使用element标签的div的id必须在new vue{}对象里: 例如:
<body>
<div id="app"> --element标签的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>
<script>
new Vue({
el: '#app', ---那么#app就必须在new Vue的el里
data: function() {
return { visible: false }
}
})
</script> 注:不用安装什么npm i element-ui -S 之类的
vue的ui库使用Element UI,纯html页面,不使用webpack那玩意的更多相关文章
- Vue(十八)Element UI
Elment UI 1. 简介 Element UI是饿了么团队提供的一套基于Vue2.0的组件库,可以快速搭建网站,提高开发效率 ElementUI PC端 MintUI 移动端 [官网](http ...
- .Net Core,VUE,VS Code,Sql Sugar,Element UI学习笔记
1..Net Core的目的是跨平台,并主要目标是作为服务端开发使用.从3.0开始,引入了Winfrom和WPF. 2..Net Core可以引用.Net Framework生成的dll和exe,不限 ...
- Vue 基于node npm & vue-cli & element UI创建vue单页应用
基于node npm & vue-cli & element UI创建vue单页应用 开发环境 Win 10 node-v10.15.3-x64.msi 下载地址: https ...
- vue Cli 按需引入Element UI 和全局引用Element UI
全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...
- 移动端前端框架UI库(Frozen UI、WeUI、SUI Mobile)
Frozen UI 自述:简单易用,轻量快捷,为移动端服务的前端框架. 主页:http://frozenui.github.io/ 开发团队:QQVIP FD Team Github:https:// ...
- 在vue项目中快速使用element UI
推荐使用npm安装 1.安装:npm install element-ui -S 2.整体引入: 在你项目的main.js中写入: import ElementUI from 'element-ui' ...
- vue中的swiper element ui
欢迎加入前端交流群交流知识&&获取视频资料:749539640 很多同学问,怎么把swiper引入到vue的脚手架里去,之前的一篇博客有提到怎么引入,但是后来感觉不怎么好,还是用一些v ...
- vue组件样式添加scoped属性之后,无法被父组件修改。或者无法在本组件修改element UI样式
在vue开发中,需要使用scoped属性避免样式的全局干扰,但是这样在父组件中是无法被修改的,不仅如此如果项目中用了UI框架比如element Ui,这个时候在本组件也无法修改样式,因为权重问题.但是 ...
- vue实现多语言国际化(vue-i18n),结合element ui、vue-router、echarts以及joint等。
老板说我们的项目要和国际接轨,于是乎,加上了多语言(vue-i18n).项目用到的UI框架是element ui ,后续echarts.joint等全都得加上多语言. 一.言归正传,i18n在vue项 ...
随机推荐
- nginx中文文档
http://www.nginx.cn/doc/ LNMP :https://lnmp.org/faq/lnmp-vhost-add-howto.html 配置详解 配置详解2
- CVPR2018_Crafting a Toolchain for Image Restoration by Deep Reinforcement Learning
CVPR2018_Crafting a Toolchain for Image Restoration by Deep Reinforcement Learning http://mmlab.ie.c ...
- 框架 Hibernate 2
持久化类百度百科 http://baike.baidu.com/link?url=gNus-8jhK0Mi401aIR-16YUAnWKzOJfeMagUV8_t5iG8235JyjMrmZPd7rI ...
- winrar 弹窗处理
https://www.rarlab.com/ 1.下载英文版 2.把下面这段code文本复制到一个新建的记事本txt文档中,然后另存为rarreg.key文件,注意后缀名.txt改为.key才行. ...
- Gradle Goodness: Automatic Clean Tasks
Gradle adds the task rule clean<Taskname> to our projects when we apply the base plugin. This ...
- java中的作用域
在说明这四个关键字之前,我想就class之间的关系做一个简单的定义,对于继承自己的class,base class可以认为他们都是自己的子女,而对于和自己一个目录下的classes,认为都是自己的朋友 ...
- 在Eclipse中执行、配置Hadoop
版权全部: zhe-jiang.he@hp.com 严禁转载! 1.安装插件 准备程序: eclipse-3.3.2(这个版本号的插件仅仅能用这个版本号的eclipse) hadoop-0.20.2 ...
- SharePoint2010代码启动工作流
1. private void StartWorkFlow() { //获得该列表上的发布的所有工作流 SPWorkflowAssociationCollection wfAssociationCol ...
- 聊聊编程开发的数据库批量插入(sql)
这里的批量插入,主要是支持SQL的大型存储数据库,本文以Mysql,Oracle,SqlServer,postgresql4类来说明,这大概是国内应用比较多的了.其余的应该可以按照这些去找.提到编程的 ...
- Linux基础-4.正文处理命令及tar命令
1.使用cat命令进行文件的纵向合并 1)掌握使用cat命令的纵向合并 a)例如:使用cat命令将test1.file1.txt和file2这三个文件纵向合并为file文件的命令为: cat test ...