vue基础之ref实现父子通信
ref 被用来给元素或子组件注册引用信息，引用信息将会注册在父组件的 $refs 对象上
用法： 子组件上定义ref="refName", 父组件的方法中用 this.$refs.refName.method 去调用子组件方法
子组件
<template>
<div>
childComponent
</div>
</template>
<script>
export default {
name: "child",
methods: {
childClick(e) {
console.log(e)
}
}
}
</script>父组件
<template>
<div>
<button @click="parentClick">点击</button>
<Child ref="mychild" /> //使用组件标签
</div>
</template>
<script>
import Child from ‘./child‘; //引入子组件Child
export default {
name: "parent",
components: {
Child // 将组件隐射为标签
},
methods: {
parentClick() {
this.$refs.mychild.childClick("我是子组件里面的方法哦"); // 调用子组件的方法childClick
}
}
}
</script>正文到此结束
热门推荐
相关文章
近期评论
-
文章和留言都翻到11页了 没有OOM
-
-
朋友，翻页到11页，及以后，会出现OOM，无法访问
-
-
搞个gitee的项目
-
-
版本号是多少，你可以下载哪个代码仓库，jdk选1.8 直接跑就行
-
-
-
Loading...
![[HBLOG]公众号](https://www.liuhaihua.cn/img/qrcode_gzh.jpg)
