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 父组件调用子组件方法
情景: 父组件中引入上传附件的子组件:点击组件可以分别上传对应要求的图片,子组件内部循环可创建多个模块. 父组件传入数组子组件循环来创建不同的组件模块,所有事件都在子组件内部. 父组件页面的上方同时有 ...
随机推荐
- FMZ发明者量化平台回测机制说明
原文连接:https://www.fmz.com/digest-topic/4009 大部分策略在实盘之前都需要回测进行验证,FMZ支持部分品种数字货币现货.期货和永续合约,以及商品期货所有品种.但发 ...
- appium(api操作)
driver.current_activity #获取当前activity driver.current_package #获取包名 driver.lock(seconds=2) #息屏 #收起虚拟键 ...
- ss user-rule自定义规则并硬连接到OneDrive进行自动同步
最近又换回Edge没了Switchy Omega用,仅仅使用GFWList感觉不够用,一些境内没服务器的网站直连还是挺慢的,于是就研究了一下PAC自定义规则. 简单说,平时用的规则就只有三种: 对于没 ...
- 洛谷 题解 P2502 【[HAOI2006]旅行】
由于此题边数比较小,所以可以先给边排个序,然后跑m遍最小生成树,每跑一次删除一条边,找最优解. 防TLE技巧 把边按从小到大的顺序排好,那么只要当前无法联通,那么后面也无法联通 最优解找法 doubl ...
- sysbench的简单安装
1. 下载 可以到网站上面找 我用到的这个是201908最新的 wget https://src.fedoraproject.org/repo/pkgs/sysbench/sysbench-1.0.1 ...
- java中讲讲PrintWriter的用法,举例?
[学习笔记] 1.2 PrintWriter的用法 PrintWriter和PrintStream类似,只不过PrintStream是针对字节流的,而PrintWriter是针对字符流的. 例:1.2 ...
- celery异步任务
1.安装 pip install celery 2.创建celery_tasks文件夹,创建config配置文件和main文件 # 在config.py文件中配置中间人broker地址信息 - red ...
- [DEBUG] spring boot在eclipse中用maven打包成jar访问templates报500错误
更新:打war包的话只要把html文件放在resources/templates下即可,根本不需要放外面. 配置application.yml和templates放外面这种做法,打war包确实不行. ...
- Vufuria入门 1 图片识别和选择
Vufutia中的图片识别功能,底层主要是识别特征点来实现的.特征点,即那些棱角分明的点.尖锐的而不是圆滑的.对比度大的而不是小的. *** 步骤: 进入vofuria官网,登录,点击develop. ...
- SHE姐妹建模记录
中午11点54分,队长把MD5码提交上去在群里发了截图,我对着屏幕上刚检查完的论文,感觉整个人都轻松起来了,又有点恍惚,可能是这几天都没睡好觉.去楼下吃了顿饭,本来打算回来倒头就睡,睡到几点算几点,醒 ...