Html | Vue | Element UI——引入使用
前言
做个项目,需要一个效果刚好Element UI有,就想配合Vue和Element UI,放在tp5.1下使用,但是引入在线的地址各种报错,本地引入就完美的解决了问题!
代码
__STATIC_JS__ | 目录为public/static/js 将样式和组件保存到本地再引入
Element UI
https://unpkg.com/element-ui/lib/theme-chalk/index.css
https://unpkg.com/element-ui/lib/index.js Vue
https://cdn.baomitu.com/vue
示例代码
<div id="app">
<el-button @click="visible = true">按钮</el-button>
<el-dialog :visible.sync="visible" title="Hello world">
<p>欢迎使用 Element</p>
</el-dialog>
</div>
<link rel="stylesheet" href="__STATIC_JS__element-ui@2.7.2.css">
<script src="__STATIC_JS__vue.js"></script>
<script src="__STATIC_JS__element-ui@2.7.2.js"></script>
<script>
new Vue({
el: '#app',
data: function() {
return { visible: false }
}
})
</script>
效果图
点击按钮后
Html | Vue | Element UI——引入使用的更多相关文章
- vue + element ui 实现实现动态渲染表格
前言:之前需要做一个页面,能够通过表名动态渲染出不同的表格,这里记录一下.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9786326.html 网站地址:我的 ...
- vue + element ui 表格自定义表头,提供线上demo
前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ...
- vue+element ui 的tab 动态增减,切换时提示用户是否切换
前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui 有一个 bug,这里记录一下如何实现.转载 ...
- vue + element ui 阻止表单输入框回车刷新页面
问题 在 vue+element ui 中只有一个输入框(el-input)的情况下,回车会提交表单. 解决方案 在 el-form 上加上 @submit.native.prevent 这个则会阻止 ...
- vue+element ui 的时间控件选择 年月日时分
前言:工作中用到 vue+element ui 的前端框架,需要选择年月日时分,但element ui官网demo有没有,所以记录一下.转载请注明出处:https://www.cnblogs.com/ ...
- Vue+element ui table 导出到excel
需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ...
- 分享一个自搭的框架,使用Spring boot+Vue+Element UI
废弃,新的:https://www.cnblogs.com/hackyo/p/10453243.html 特点:前后端分离,可遵循restful 框架:后端使用Spring boot,整合了aop.a ...
- Vue + Element UI 实现权限管理系统
Vue + Element UI 实现权限管理系统 前端篇(一):搭建开发环境 https://www.cnblogs.com/xifengxiaoma/p/9533018.html
- vue+element ui 的上传文件使用组件
前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ...
随机推荐
- 控制台程序读取Excel设置角色权限
摘要: 本人微信公众号:微软动态CRM专家罗勇 ,回复283或者20181118可方便获取本文,同时可以在第一间得到我发布的最新博文信息,follow me!我的网站是 www.luoyong.me ...
- 广州.NET微软技术俱乐部与其他技术群的区别
.NET和微软技术相关的微信群有不少, 那么广州.NET微软技术俱乐部与其他技术群的区别是什么呢? 有十分大的区别! 本群公告写得很清楚! 本群坚决禁止讨论“JAVA和.NET哪个好”.“NET有没有 ...
- java新知识系列 五
类方法和对象方法的使用限制 abstract修饰符的注意 静态变量只能在类主体中定义,不能在方法中定义 线程的各种方法差别 关于抽象类 什么是中间件 Servlet生命周期的三个主要方法 可以修饰类的 ...
- 关于SQL数据库 msdb.dbo.sp_send_dbmail 函数发送邮件的几个实例
在推行系统中,时不时会有用户提出希望系统能自动推送邮件,由于手头的工具和能力有限,不少需求都借助于sql server的邮件触发来实现. 步骤: 1.配置邮箱.步骤略,网上有不少帖子说明,手工直接在管 ...
- django 创建admin用户名跟密码
一.django中创建用户名和密码 (venv) D:\project\py37project\Djangopro\Procrm>Python37 manage.py createsuperus ...
- MySql 学习之路-Date函数
MySQL中重要的内建函数 函数 描述 NOW() 返回当前的日期和时间 NOW() 返回当前的日期和时间. 语法 NOW() -- 实例 -- 下面是 SELECT 语句: SELECT NOW() ...
- Angular的项目结构
前面我们已经在我们想要的位置顺利的创建了Angular项目,现在我们就来看一下项目的结构吧. 下面使我们项目的整体结构,包括node的模板.src资源文件以及配置文件等. 下面是根目录文件夹内的文件用 ...
- 关于 pyspider Web预览界面太小的解决方法
本人最近在学习pyspider时,遇到Web预览界面太小而无法很好的进行开发,于是在网上搜索解决方法. 准备: css代码: body{margin:;padding:;height:%;overfl ...
- css设置文字上下居中,一行文字居中,两行或多行文字同样居中。
转:https://www.cnblogs.com/handsomeBoys/p/6599062.html HTML: <div class="book-detail-store-it ...
- jdk 环境变量
1. jdk安装后的目录 2.JAVA_HOME C:\Program Files\Java\jdk1.8.0_172 3.PATH %JAVA_HOME%\bin 4.CLASSPATH .;%JA ...