iview modal 弹框 模板

<!--
* @description 上传图片
* @fileName camera.vue
* @author 彭成刚
* @date // ::
* @version V1.0.0
!-->
<template>
<div>
<Modal @on-cancel="modalCancel"
class="uploadPhoto"
v-model="modalVmodel"
width=""
:mask-closable="false"
title="上传图片">
<div class='divFormClass'> </div> <div slot="footer">
<Button @click="modalCancel">关闭</Button> <Button type="primary"
@click="modalSave">保存</Button> </div>
</Modal>
</div>
</template> <script>
export default {
data () {
return {
modalVmodel: false
}
}, components: {}, computed: {}, mounted () {
this.modalVmodel = true
}, methods: {
modalCancel () {
this.modalVmodel = false
},
modalSave () { }
}
} </script>
<style lang='less' scoped>
.uploadPhoto {
.divFormClass {
height: calc(~"100vh - 350px");
overflow-y: auto;
padding-right: 15px;
}
}
</style>

iview modal 弹框 模板的更多相关文章

  1. modal 弹框遮罩层,滚动穿透bug 解决方案

    modal 弹框遮罩层,滚动穿透bug 解决方案 parent component 动态设置 lock css const computedClassName = classNames( 'activ ...

  2. 关于微信小程序 modal弹框组件的介绍

    微信小程序 modal: 这里对微信小程序中 modal组件进行详细解析,我想开发微信小程序的小伙伴可以用到,这里小编就记录下modal的知识要点. modal modal类似于javascript中 ...

  3. vue iview modal弹出框 form表单验证

    一.ref="addApply" :model="addApply" :rules="ruleValidate"   不要忘记prop 二. ...

  4. 网页全屏,modal 弹框无法显示的问题

    问题描述页面主体部分全屏后,页面中的所有弹窗不能显示,退出全屏后,弹窗正常.解决方法校园项目中,所有用到的弹窗为iview的弹窗组件,该弹窗组件会生成在body中,和项目主体app为平行关系,项目主体 ...

  5. vue 弹框

    弹框展示: 代码: <template> <div> <el-col :span="9" style="text-align: right; ...

  6. 基于uni-app全端弹框组件uaPopup「兼容h5+小程序+app端|nvue」

    uniapp兼容多端自定义模态弹框组件UAPopup ua-popup 一款轻量级的uniapp自定义弹窗组件.汇集了android.ios和微信弹窗效果(msg消息.alert提示框.dialog对 ...

  7. 微信小程序之----弹框组件modal

    modal modal类似于javascript中的confirm弹框,默认情况下是一个带有确认取消的弹框,不过点击取消后弹框不会自动隐藏,需要通过触发事件调用函数来控制hidden属性. 官方文档 ...

  8. 常用UI模板,loading框,提醒框,弹框确认框

    css部分 #public_box{width:100%;height:100%;position:fixed;top:0;left:0;z-index:100;background:rgba(0,0 ...

  9. 弹框modal, 获取id与绑定id

    var span2 = '<span class="replaceBlue cursor" data-target="#myModalMember" da ...

随机推荐

  1. TCP连接、释放及HTTPS连接流程

    一.建立连接是三次握手 为什么三次握手?前两次握手为了确认服务端能正常收到客户端的请求并愿意应答,后两次握手是为了确认客户端能正常收到服务端的请求并愿意应答.三次握手可以避免意外建立错误连接而导致浪费 ...

  2. 传统开发有必要学Dubbo吗

    dubbo作为一个知名的分布式服务调用框架,在众多互联网公司都有广泛的应用.但其本质还是一个远程服务调用框架,最初就是为了应对SOA服务治理时才用到的,如果本身服务不多就没必要用它了.如果对技术感兴趣 ...

  3. node --save可以省略掉手动修改package.json的步骤

    当你为你的模块安装一个依赖模块时,正常情况下你得先安装他们(在模块根目录下npm install module-name),然后连同版本号手动将他们添加到模块配置文件package.json中的依赖里 ...

  4. caffe 入门实例3 fine-turning

    占坑,使用fine-turning初始化参数...

  5. In-App Purchase Programming Guide----(七) ----Restoring Purchased Products

    Restoring Purchased Products Users restore transactions to maintain access to content they’ve alread ...

  6. Spring之配置文件加载方式

    spring在org.springframework.core.io包中提供了多种配置文件加载方式.无论是XML.URL还是文件,都有很好的支持.比如基于URL的UrlResource.基于输入流的I ...

  7. UVaLive 6591 && Gym 100299L Bus (水题)

    题意:略. 析:不解释,水题. 代码如下: #pragma comment(linker, "/STACK:1024000000,1024000000") #include < ...

  8. E20170414-ms

    collapse v/n 奔溃,垮台 constraint  n 约束,限制 adaptive  adj 适应的; 有适应能力的; exhausitive adj. 详尽的; store n 商店,仓 ...

  9. vbox虚拟机配置Redhat6.4本地yum源

    作为一个新手,配置这个yum源配了4天,遇到了各种问题,也按照网络上面一些方法在163上面下载CentOS6的yum源来替换Redhat本地的yum源,但是配置过程中,出现很多错误,发现直接在本地配置 ...

  10. 51Nod 1649 齐头并进

    #include <iostream> #include <algorithm> #include <cstring> //两遍迪杰斯特拉 #define INF ...