vue.js中父组件触发子组件中的方法
知识点:vue.js中,父组件的method中,触发子组件中的方法,获得子组件中的定义的属性
(1)子组件 :
child_crud.js
var html_child_crud=
"<div>\n" +
。。。子组件页面内容
"</div>";
var child_crud= Vue.component('child_crud', {
    template:html_child_crud ,
    data : function(){
        return {
            name:"子组件"
}
},
methods: {
//子组件中的方法
query:function(){ }
},
});
(2)父组件:
<script type="text/javascript" src="../child_crud.js"></script>
<div id="myvue">
<template>
<child_crud ref="childComponent"></child_crud>
</template>
</div>
<script>
var myvue = new Vue({
    el: '#myvue',
    data:function() {
        return {
        };
    },
    methods: {
       invokeChildmethod:function(){
           //父类通过ref="face_device_log"给子类起的名字face_device_log,调用子类中的方法
           this.$refs.childComponent.query();
           //调用子类中属性,更改子类中属性
           this.$refs.childComponent.name='parent';
       }
   }
})
</script>
vue.js中父组件触发子组件中的方法的更多相关文章
- vue-property-decorator和typescript结合构建的class类组件,父组件触发子组件方法的方式
		vue-property-decorator和typescript结合构建的class类组件,父组件触发子组件方法的方式 class类组件示例 Father类组件 <template> & ... 
- React 父组件触发子组件事件
		Parent组件 import React from "react"; import Child from "./component/Child"; class ... 
- [转] vue父组件触发子组件事件
		1. 父组件中获取子组件方法 $children 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <template> < ... 
- vue中父级与子组件生命周期的先后顺序
		1.vue的生命周期 2.views/createrCustormer.vue为父级 <template> <expressService /> </ ... 
- 基于vue,通过父组件触发子组件的请求,等请求完毕以后,显示子组件,同时隐藏父组件
		正常情况下,子组件应该尽量减少业务逻辑,而应该将业务逻辑放到父组件里面,从而减少耦合,但是当 我们不得不用到这种情况时,可以采用下面的思路 解决方案 尽量将请求单独作为一个函数(不要将请求放到show ... 
- vue父组件触发子组件方法
		比如应用场景是弹窗中的组件,想要点弹窗时更新该组件展示对应记录的的值 methods: { edit (record) { this.mdl = Object.assign({}, record) t ... 
- iframe中父页面与子页面的传值方法
		涉及到iframe传值的情况有这么几种:(1)父页面给iframe中的子页面传值(2)子页面调用父页面中的函数(3)iframe中的子页面给父页面传值(4)兄弟iframe之间的传值 下面来逐一看一下 ... 
- vue.js组件之间通讯--父组件调用子组件的一些方法,子组件暴露一些方法,让父组件调用
		<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ... 
- vue 父组件调用子组件方法
		情景: 父组件中引入上传附件的子组件:点击组件可以分别上传对应要求的图片,子组件内部循环可创建多个模块. 父组件传入数组子组件循环来创建不同的组件模块,所有事件都在子组件内部. 父组件页面的上方同时有 ... 
随机推荐
- 阿里云Centos 7.6安装Redis以及开启远程连接
			下载地址:http://redis.io/download,下载最新稳定版本. 本教程使用的最新文档版本为 5.0.5,下载并安装: $ wget http://download.redis.io/r ... 
- go string类型的特性
			参考文章: http://c.biancheng.net/view/36.html 1. 获取ascii类型字符的长度个数和获取utf8类型字符长度的个数 a. len("咪咪") ... 
- 主成分分析(PCA)与线性判别分析(LDA)
			主成分分析 线性.非监督.全局的降维算法 PCA最大方差理论 出发点:在信号处理领域,信号具有较大方差,噪声具有较小方差 目标:最大化投影方差,让数据在主投影方向上方差最大 PCA的求解方法: 对样本 ... 
- [转帖]SPARC简介
			https://www.cnblogs.com/chaohm/p/5674886.html 1. 概述 SPARC(Scalable Processor ARChitecture,可扩展处理器架 ... 
- [转帖]iphone11的部分参数 UX
			iPhone 11将于9月11号凌晨发布 靠谱爆料在这 https://www.cnbeta.com/articles/tech/884199.htm iphone的分辨率 非常高.. iphone ... 
- SQLite进阶-15.触发器
			目录 触发器(Trigger) 触发器(Trigger)的要点: 触发器应用 查看触发器 删除触发器 触发器(Trigger) 触发器(Trigger)是数据库的回调函数,它会在指定的数据库事件发生时 ... 
- 把人都送到房子里的最小花费--最小费用最大流MCMF
			题意:http://acm.hdu.edu.cn/showproblem.php?pid=1533 相邻的容量为inf,费用为1,S到m容量为1,费用为0 ,H到T容量为1,费用为0. 建图跑-最小费 ... 
- centos8自定义目录安装nginx
			1.安装工具和库 # PCRE是一个Perl库,包括 perl 兼容的正则表达式库.nginx 的 http 模块使用 pcre 来解析正则表达式 # zlib库提供了很多种压缩和解压缩的方式, ng ... 
- python学习-10 运算符1
			1.加+,减-,乘*,除/ 例如: a = 1 b = 2 c = a + b print(c) 运算结果: 3 Process finished with exit code 0 a = 1 b = ... 
- PB做的托盘程序(最小化后在左下角显示图标)
			见‘文件’资源 
