iview 父组件动态传值给子组件
父组件
<maintenance-super :show="{'modalSuper':modalSuper,'myData':myData}" @on-close="closeModal" ></maintenance-super>
父组件
<maintenance-super :show="{'modalSuper':modalSuper,'myData':myData}" @on-close="closeModal" ></maintenance-super>
export default {
components: { MaintenanceSuper},
data() {
return {
value:{
telephone:null,
},
myData: {
pageNum: 1,
pageSize: 10,
total: 0,
userModel: {
id: null,
account: null,
director: null, //负责人
}
},
}
子组件
<template>
<div>
<!-- =================== 管理员:表格 =================================== -->
<Modal :title="title" v-model="modalSuper" width="800" :closable="false" @on-hide="hide">
<Table border :columns="superColumns" :data="superData">
<template slot-scope="{ row, index }" slot="action">
<Button type="primary" size="small" @click="restPassWordInfo(row,index)">重置密码</Button>
<Button type="error" size="small" @click="disableAccount(row,index)">警用</Button>
</template>
</Table>
<!-- ======================= 分页 ==================================== -->
<Page
:total="superForm.total"
:current="superForm.pageNum"
:page-size="superForm.pageSize"
@on-change="handlePageSuper"
@on-page-size-change="handlePageSizeSuper"
class="tablePage"
/> <div style="text-align: right;margin-top: 10px;">
<Button @click="handleResetSuper('searchData')">取消</Button>
<Button icon="md-add" type="primary" @click="toSuperModalAdd">新建管理员账户</Button>
</div>
<div slot="footer"></div>
</Modal>
</div>
</template>
props:['show','myData'],
watch: {
show(validate) {
console.log(validate,'1')
if (validate.modalSuper == true) {
this.modalSuper = validate.modalSuper;
this.getTableDataPage();
}
}
传值给父,弹框关闭
handleResetSuper(name) {
// this.modelSuperAdd = false;
// this.$refs[name].resetFields();
this.modalSuper = false;
this.$emit("on-close", false);
},
onClose() {
this.$emit("on-close", false);
},
父组件接收到子组件的传值
methods: {
closeModal(newVal) {
this.modalSuper = newVal;
}
}
iview 父组件动态传值给子组件的更多相关文章
- vue 父组件动态传值至子组件
1.进行数据监听,数据每次变化就初始化一次子组件,进行调取达到传递动态数据的目的普通的监听: watch:{ data: function(newValue,oldValue){ doSomeThin ...
- Vue--子组件互相传值,子组件来回传值,传值反复横跳
Vue--子组件传值,子组件来回传值,子组件传值反复横跳 我不不仅要子组件之间直接传值,我还要传过去再传回来,传回来再传过去,子组件直接反复横跳 解决问题 给组件传值,并不知道改值的校验结果 同一个组 ...
- vue点击父组件里面的列表动态传值到子组件
<template> <div> 爸爸 <div style="background-color:yellow;margin-top:10px" v- ...
- vue使用props动态传值给子组件里的函数用,每次更新,呼叫函数
父组件 <template> <div id="app"> <div>详情内容</div> <button v-on:clic ...
- vue父组件向子组件动态传值的两种方法
在一些项目需求中需要父组件向子组件动态传值,比如我这里的需求是,父组件动态通过axios获取返回的图片url数组然后传给子组件,上传图片的子组件拿到该数组后进行遍历并展示图片,因为有时候获取到的会是空 ...
- 父组件传值给子组件的v-model属性
父组件如何修改子组件中绑定的v-model属性 因为v-model属性是双向数据绑定,而vue的通信方式又是单向通信,所以,当子组件想要改变父组件传过来的值的属性时,就会报错,典型的就是父组件传值给子 ...
- vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。
vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...
- 【转】Vue组件一-父组件传值给子组件
Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...
- vue 组件-父组件传值给子组件
父组件通过属性,传值给子组件,子组件通过,props数组里的名称来接受父组件传过来的值. HTML部分: <div id="app"> <tmp1 :parent ...
随机推荐
- 自动构建War包的Ant build.xml模板
<?xml version="1.0" encoding="UTF-8" ?> <project name="[*****]你的项目 ...
- JS之理解继承
JS之理解继承:https://segmentfault.com/a/1190000010468293 1.call继承,也叫借用构造函数.伪造对象或是经典继承.call继承回把父类的私有属性和方法继 ...
- CAS单点登录系统--进阶
2.CAS服务端数据源设置 2.1需求分析 我们现在让用户名密码从我们的优乐选的user表里做验证 2.2配置数据源 (1)修改cas服务端中web-inf下deployerConfigContext ...
- Codeforces 1262D Optimal Subsequences(BIT+二分)
首先比较容易想到肯定是前k大的元素,那么我们可以先对其进行sort,如果数值一样返回下标小的(见题意),接下里处理的时候我们发现需要将一个元素下标插入到有序序列并且需要访问第几个元素是什么,那么我们可 ...
- K8S工作原理
kubernetes(k8s)是docker容器用来编排和管理的工具 我们通过kubectl向k8s Master发出指令.kubernetes Master主要是提供API Server.Sched ...
- 45. Jump Game II (JAVA)
Given an array of non-negative integers, you are initially positioned at the first index of the arra ...
- Taro -- Swiper的图片由小变大3d轮播效果
Swiper的图片由小变大3d轮播效果 this.state = ({ nowIdx:, swiperH:'', imgList:[ {img:'../../assets/12.jpg'}, {img ...
- JVM 常量池、运行时常量池、字符串常量池
常量池: 即class文件常量池,是class文件的一部分,用于保存编译时确定的数据. 保存的内容如下图: D:\java\test\out\production\test>javap -ver ...
- Flask【第5篇】:用Falsk实现的分页
用flask实现的分页 一.flask实现的分页组件 from urllib.parse import urlencode,quote,unquote class Pagination(object) ...
- Django【第18篇】:Django之缓存
Django 之缓存 一.缓存 由于Django是动态网站,所有每次请求均会去数据进行相应的操作,当程序访问量大时,耗时必然会更加明显,最简单解决方式是使用:缓存,缓存将一个某个views的返回值保存 ...