iview modal 弹框 模板
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 弹框 模板的更多相关文章
- modal 弹框遮罩层,滚动穿透bug 解决方案
modal 弹框遮罩层,滚动穿透bug 解决方案 parent component 动态设置 lock css const computedClassName = classNames( 'activ ...
- 关于微信小程序 modal弹框组件的介绍
微信小程序 modal: 这里对微信小程序中 modal组件进行详细解析,我想开发微信小程序的小伙伴可以用到,这里小编就记录下modal的知识要点. modal modal类似于javascript中 ...
- vue iview modal弹出框 form表单验证
一.ref="addApply" :model="addApply" :rules="ruleValidate" 不要忘记prop 二. ...
- 网页全屏,modal 弹框无法显示的问题
问题描述页面主体部分全屏后,页面中的所有弹窗不能显示,退出全屏后,弹窗正常.解决方法校园项目中,所有用到的弹窗为iview的弹窗组件,该弹窗组件会生成在body中,和项目主体app为平行关系,项目主体 ...
- vue 弹框
弹框展示: 代码: <template> <div> <el-col :span="9" style="text-align: right; ...
- 基于uni-app全端弹框组件uaPopup「兼容h5+小程序+app端|nvue」
uniapp兼容多端自定义模态弹框组件UAPopup ua-popup 一款轻量级的uniapp自定义弹窗组件.汇集了android.ios和微信弹窗效果(msg消息.alert提示框.dialog对 ...
- 微信小程序之----弹框组件modal
modal modal类似于javascript中的confirm弹框,默认情况下是一个带有确认取消的弹框,不过点击取消后弹框不会自动隐藏,需要通过触发事件调用函数来控制hidden属性. 官方文档 ...
- 常用UI模板,loading框,提醒框,弹框确认框
css部分 #public_box{width:100%;height:100%;position:fixed;top:0;left:0;z-index:100;background:rgba(0,0 ...
- 弹框modal, 获取id与绑定id
var span2 = '<span class="replaceBlue cursor" data-target="#myModalMember" da ...
随机推荐
- Java中断机制
1. 引言 当我们点击某个杀毒软件的取消按钮来停止查杀病毒时,当我们在控制台敲入quit命令以结束某个后台服务时……都需要通过一个线程去取消另一个线程正在执行的任务.Java没有提供一种安全直接的方法 ...
- vue 基本知识整理
1 每个Vue.js应用都是通过构造函数Vue创建一个Vue的根实例 2 可以扩展Vue构造器,从而使用预定义选项创建可复用的组件构造器 所有的Vue.js组件其实都是被扩展的Vue实例 每一个VUE ...
- py-day15_css+js_初
css+js_初 一.鼠标移动变色 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...
- bzoj2144
二分+lca 我们把向中间缩看成向上爬,向两边走看成向下爬,那么就相当于找出两个状态的lca,如果相邻的差是(a,b),a<b,那么向中间走就是(a,b-a)或(b-a,a),这个东西很像更相减 ...
- Event Handling Guide for iOS--(三)---Event Delivery: The Responder Chain
Event Delivery: The Responder Chain 事件传递:响应链 When you design your app, it’s likely that you want to ...
- 语言学习系列-Scala连接数据库示例
Scala语法 预装数据库Mysql,登录用户名密码为:root:root,建立数据库test1,建立数据表emp: package com.ccb.day1 import java.sql.Dr ...
- Objective-C中的字符串格式化输出(转载)
转自:http://www.cnblogs.com/jackbutler/archive/2012/04/05/2432828.html %@ 对象 %d, %i 整数 %u 无符整形 %f 浮点/双 ...
- 【社群话题分享】LAMP 还是 LNMP 或者 ?
每周三下午的话题活动是又拍云技术社群的优良传统- 大家一起来看看这周都聊了些啥吧- 往期话题推荐: [社群话题分享]Linux 各大发行版你怎么选? [社群话题分享]数据权限该怎么放? [社群话题分享 ...
- C++开发工程师面试题库 100~150道
101. 编写strcat函数(6分) 已知strcat函数的原型是char *strcat (char *strDest, const char *strSrc); 其中strDest 是目的字符串 ...
- C++笔试题库之编程、问答题 100~150道
101. winsock建立连接的主要实现步骤? 答: 服务器端:socket()建立套接字,绑定(bind)并监听(listen),用accept()等待客户端连接, accept()发现有客户端连 ...