【vue】vue +element 搭建项目,$createElement使用
语法:
它有三个参数
第一个:html标签名
第二个:配置的数据对象
第三个:内容
应用1:自定义弹窗
html:
<el-button type="text" @click="open4">点击打开 Message Box</el-button>
js
methods: {
open4() {
const h = this.$createElement;
const aTemp = 'https://www.baidu.com/?tn=98010089_dg&ch=8';
this.$msgbox({
title: '消息',
message: h('p', null, [
h('span', null, '内容可以是 '),
h('a', {
//普通html特性
attrs: {
href:aTemp
},
//相当于`v-bind:style`
style: {
color: 'red',
fontSize: '14px'},
},
'百度'
)
]),
showCancelButton: true,
confirmButtonText: '确定',
cancelButtonText: '取消',
beforeClose: (action, instance, done) => {
if (action === 'confirm') {
instance.confirmButtonLoading = true;
instance.confirmButtonText = '执行中...';
setTimeout(() => {
done();
setTimeout(() => {
instance.confirmButtonLoading = false;
}, 300);
}, 3000);
} else {
done();
}
}
}).then(action => {
alert('>>>>>');
this.$message({
type: 'info',
message: 'action: ' + action
});
});
}
},
效果
未完待续。。。
参考链接:
- https://blog.csdn.net/kkae8643150/article/details/52910389
- https://blog.csdn.net/wbiokr/article/details/77894946
作者:smile.轉角
QQ:493177502
【vue】vue +element 搭建项目,$createElement使用的更多相关文章
- Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记
前言 本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...
- vue.js + element 搭建后台管理系统 笔记(一)
此文仅记录本人在搭建后台系统过程中遇到的难点及注意点,如果能帮到各位自然是极好的~~~ 项目主要架构:vueJS.elementUI.scss 一.项目初始化 首先需要安装nodejs,安装方法就不在 ...
- vue教程3-webpack搭建项目
vue-cli https://cli.vuejs.org/zh/ vue-cli是vue的命令行工具,对于创建项目,安装各种组件,运行项目都极为方便,是在开发vue中的必备工具 vue-cli基于n ...
- 手动搭建Vue之前奏:搭建webpack项目
手动搭建vue项目 搭建vue前首先搭建webpack项目 首先你应当安装一下npm以及nodejs 安装完成后,进行如下操作: // 创建项目根目录 mkdir some_project_name ...
- 使用VUE CLI3.0搭建项目vue2+scss+element简易版
1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...
- 使用vue+webpack从零搭建项目
vue到现在已经成为一个热门的框架,在项目实践当中,如果想要创建一个新项目,通常都会使用vue-cli的脚手架工具,毋容置疑能够方便很多,很多东西也不需要自己亲自去配置.都知道,脚手架其实是vue结合 ...
- vue项目ide(vue项目环境搭建)
一.先介绍一下我接下来要做的项目 项目:ide可视化工具 技术应用: Vue2.0(js框架):https://cn.vuejs.org/ ElementUi(饿了吗ui框架基于vue的):http: ...
- Vue常用的GitHub项目
Vue常用的GitHub项目(Demo案例) 应用实例 https://github.com/pagekit/pa... pagekit-轻量级的CMS建站系统 https://github.com/ ...
- Vue.js+vue-element搭建属于自己的后台管理模板:什么是Vue.js?(一)
Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js是什么?(一) 前言 本教程主要讲解关于前端Vue.js框架相关技术知识,通过学习一步一步学会搭建属于自己的后台管理模板,并 ...
- Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二)
Vue.js+vue-element搭建属于自己的后台管理模板:Vue.js快速入门(二) 前言 上篇文章对Vue.js有了初步理解,接下来我们把Vue.js基础语法快速的过一遍,先混个脸熟留个印象就 ...
随机推荐
- vue批量验证提交表单的数据是否合规
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- [Android][Framework] 添加系统服务
新博客地址 http://wossoneri.github.io/2018/09/15/[Android][Framework]create-system-service/ 做系统开发,有时候需要自己 ...
- mysql的数据类型和字段属性
本文内容: 数据类型 数值类型 整数型 浮点型 定点型 日期时间类型 字符串类型 补充: 显示宽度与zerofll 记录长度 字段属性 空\不为空值:NULL.NOT NULL 主键:primary ...
- JavaWeb:servlet实现下载与上传功能
本文内容: servlet实现下载功能 servlet实现上传功能 首发日期:2018-07-21 servlet实现下载功能 实现流程 1.首先制作一个jsp页面,主要是用来触发下载的.这里可以根据 ...
- XML 和 DTD
1.XML 1.1xml简介 a)xml,eXtensible Markup Language,可扩展标记语言,是一种标记语言: b)xml是一种非常灵活的语言,没有固定的标签,所有的额标签都可以自定 ...
- margin塌陷与BFC总结
只给出关键点,具体效果不做太多示范,真正的东西只有自己试了才能记住 BFC BFC触发: 1.position:absolute/fixed 2.float:left/right 3.display: ...
- 使用fiddler对手机上的程序进行抓包
用fiddler对手机上的程序进行抓包,网上有很多的资料,这里写一下来进行备用. 前提: 1.必须确保安装fiddler的电脑和手机在同一个wifi环境下 备注:如果电脑用的是台式机,可以安装一个 ...
- [20181130]hash冲突导致查询缓慢.txt
[20181130]hash冲突导致查询缓慢.txt --//昨天看了链接https://jonathanlewis.wordpress.com/2018/11/26/shrink-space-2/, ...
- 利用Python通过频谱分析和KNN完成iphone拨号的语音识别
最近这段时间,学校里的事情实在太多了,从七月下旬一直到八月底实验室里基本天天十二点或者通宵,实在是没有精力和时间来写博客.这周老师出国开会,也算有了一个短暂的休息机会,刚好写点有意思的东西. 上周在天 ...
- 搭建windows测试环境的步骤
步骤:1.JDK安装 2.配置好JDK环境变量3.Tomcat安装4.将war包放在Tomcat的发布目录中webapps中,5.conf>server.xml里面设置默认解压,unpackW ...