子組件調用父組件方法

隨筆：后面時間充足了再補充

父組件

<template><div><head-title3 ref="headerNews3"></head-title3><router-view></router-view></div> </template> <script> import HeadTitle3 from './HeadTitle3' export default {name: 'change',components:{HeadTitle3},data (){return {title: '修改密碼'}},methods: {getHeadData(){this.$refs.headerNews3.newsData();}},created () {},mounted () {this.getHeadData();}, } </script>

子組件

<template><div class="changePassword3"><div class="changePassword3main"><head-title4 :title2="title"></head-title4></div><div class="changePassword3bottom"><div class="changePassword3top"><i></i><span>修改成功！</span></div></div></div> </template> <script> import HeadTitle4 from './HeadTitle4' export default {name: 'change3',components:{HeadTitle4},data (){return {title: '修改密碼',}},methods: {},created () {},mounted () {this.$parent.getHeadData();}, } </script>

主要使用了this.$parent調父組件

還有其他的方法，后面再補充

總結

以上是生活随笔為你收集整理的vue子组件调用父组件内的方法的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。