vue 父到子动态传值 子组件实时渲染
近期项目中需要一个功能,根据选择不同的 团队片区 id 展示不同的数据,团队id 在父组件 数据在子组件中展示。
根据不同的团队 动态渲染数据总览。
父组件:
<Cards ref="getCardId"></Cards>
data() {
return { params:{
enterprises:'',
}, };
},
引入子组件
import {Cards} from "./components" export default {
components: {
Cards,
},
}
点击查询:
// 查询
queryCallback(){ // console.log('点击查询') // console.log(this.$refs.getCardId); this.$refs.getCardId.getDataScreen(this.params.enterprises) }
子组件:
data() {
return {
// cardId:[],
params:{
enterpriseId:''
},
dataScreen: {} // 数据总览
}
},
methods: {
getDataScreen(m ) { this.params.enterpriseId = m homeApi.getDataScreen(this.params ).then(data => {
this.dataScreen = data
this.cardId = []
})
}
}
1
vue 父到子动态传值 子组件实时渲染的更多相关文章
- 父窗口window.showModalDialog传值 子窗口window.returnValue返回值
父窗口打开子窗口页面: var fatherWindow = document.all.dealReason;//想传的值 win = window.showModalDialog(strUrl, f ...
- vue父组件向子组件动态传值的两种方法
在一些项目需求中需要父组件向子组件动态传值,比如我这里的需求是,父组件动态通过axios获取返回的图片url数组然后传给子组件,上传图片的子组件拿到该数组后进行遍历并展示图片,因为有时候获取到的会是空 ...
- vue 父组件给子组件传值,子组件给父组件传值
父组件如何给子组件传值 使用props 举个例子: 子组件:fromTest.vue,父组件 app.vue fromTest.vue <template> <h2>{{tit ...
- Vue 父组件传值到子组件
vue 父组件给子组件传值中 这里的AccessList就是子组件 如果 是静态传值的话直接 msg="xxx"就好 这里动态取值的话就 :msg=xxxxx ________ ...
- Vue父组件向子组件传递一个动态的值,子组件如何保持实时更新实时更新?
原文:https://blog.csdn.net/zhouweixue_vivi/article/details/78550738 2017年11月16日 14:22:50 zhouweixue_vi ...
- Vue父组件像子组件传值--自定义属性
这里有个注意的地方,Vue实例控制app DIV 大组件,我们在div中天加小组件的时候,传值需要创建自定义的属性 之后在通过props:[‘属性名’] 来把父元素data中的数据传递给子组件 < ...
- vue父组件异步获取动态数据传递给子组件获取不到值
原理: 在父组件中使用axios获取异步数据传给子组件,但是发现子组件在渲染的时候并没有数据,在created里面打印也是空的,结果发现一开始子组件绑定的数据是空的,在请求数据没有返回数据时,子组件就 ...
- Vue等待父组件异步请求回数据'后'传值子组件
问题: 让子组件在父组件有哪个数据的时候再渲染, 解决方案: 可以在父组件上加一个判断条件, 举例说明: <a-component :opt="opt" v-if=" ...
- vue父组件传参给子组件
其实组件之间传参有很多种方法: 1.通过本地存储 2.使用vuex状态管理 今天记录一下第三种方法 1.首页我们先创建一个项目(创建项目自行百度) 2.打开项目,在components文件夹下新建一个 ...
随机推荐
- 使用jxls导出Excel报表
导入jar包: <dependency> <groupId>net.sf.jxls</groupId> <artifactId>jxls-core< ...
- OpenCV常用基本处理函数(5)图像模糊
2D卷积操作 cv.filter2D() 可以让我们对一幅图像进行卷积操作, 图像模糊(图像平滑)使用低通滤波器可以达到图像模糊的目的.这对与去除噪音很有帮助.其实就是去除图像中的高频成分(比如:噪音 ...
- BZOJ 3653: 谈笑风生(主席树)
传送门 解题思路 首先对于一个\(a\)来说,要求\(b\)和\(c\),那么\(a,b,c\)一定在一条链上.把\(b\)分类讨论,如果\(b\)是\(a\)的祖宗,这个方案数就很好统计了,就是\( ...
- 深入研究CSS
通常我们在学习CSS的时候,感觉很容易掌握,却常常在实际应用中碰到各式各样难以填补的“坑”,为避免大家受到同样的困惑与不解,本文详细讲解了CSS中优先级和Stacking Context等诸多高级特性 ...
- 探索Redis设计与实现7:Redis内部数据结构详解——intset
本文转自互联网 本系列文章将整理到我在GitHub上的<Java面试指南>仓库,更多精彩内容请到我的仓库里查看 https://github.com/h2pl/Java-Tutorial ...
- Myeclipse下使用Maven搭建spring boot2.0项目
现在需要搭建spring boot框架,并实现一个HelloWorld的项目,让程序真正运行起来. 一.在pom.xml中引入spring-boot-start-parent,spring官方的叫st ...
- GIL - global interpreter lock
python是一个解释型语言,但是可以使用多个解释器.比如C++,但是可以用不同的编译器来编译成可执行代码.有名的编译器例如GCC,INTEL C++,Visual C++等.Python也一样,同样 ...
- PHP错误检测
开发的时候,我们有时候需要打开错误信息.这时候,可以在php文件里设置:ini_set('display_errors','on');error_reporting(E_ALL); 不过有时候我们及时 ...
- 【单例模式】懒汉式的线程安全问题 volatile的作用
原文链接:https://blog.csdn.net/Activity_Time/article/details/96496579 ****** 1. 懒汉式的Java实现 public class ...
- MYSQL索引的深入学习
通常大型网站单日就可能会产生几十万甚至几百万的数据,对于没有索引的表,单表查询可能几十万数据就是瓶颈. 一个简单的对比测试 以我去年测试的数据作为一个简单示例,20多条数据源随机生成200万条数据,平 ...