前些天發現了一個巨牛的人工智能學習網站，通俗易懂，風趣幽默，忍不住分享一下給大家。點擊跳轉到教程。

我們都知道通過$ref可以獲取到某個DOM，但是它也可以用來獲取子組件的實例，調用子組件的方法

例：?
子組件：

<template><div></div>
</template><script>export default {methods:{childMethod(flag) {console.log(flag)}},created(){}}
</script>

父組件： 在子組件中加上ref即可通過this.$refs.ref.method調用

<template><div @click="parentMethod"><children ref="child1"></children></div>
</template><script>import children from 'components/children/children.vue'export default {data(){return {flag: true}},components: { ? ? ?'children': children},methods:{parentMethod() {console.log(this.$refs.child1) //返回的是一個vue對象，所以可以直接調用其方法this.$refs.child1.childMethod(this.flag);?}}}
</script>

例子，兄弟組件間傳遞DOM數據，調用函數
寫一個兄弟組件之間傳遞數據，父組件調用方法的案例：?
第一個子組件cartcont，發射數據

this.$emit('cartadd', event.target);

父組件接收數據，并將數據，通過調用另一個子組件shopcart 的方法傳遞給另一個子組件shopcart

<v-cartcont :food="food" @cartadd='_drop'></v-cartcont>
<v-shopcart ref='shopcart'></v-shopcart>_drop(target){console.log('父組件接收數據')this.$refs.shopcart.drop(target);
}

shopcart子組件的方法

drop(el){console.log('調用另一個子組件的方法')console.log(el)
}

---------------------?

轉自：https://blog.csdn.net/qq_34664239/article/details/80386153?
?