vue父页面如何调用子组件的方法？在使用组件开发项目的时候，父子传参和互相调用方法是常见的操作，那么下面总结一下我目前用的vue父页面调用子组件的方法。

vue父页面调用子组件的方法-QUI-Notes

实现步骤

1.引入组件，声明组件

import {uiPage} from '../components'
....
components: {
    uiPage
}

2.页面使用组件

<uiPage></uiPage>

3.用ref给组件起个“名字”，方便接下来操作

<uiPage ref="childs"></uiPage>

4.在父页面需要的地方通过 this.$refs.'名字'.'子组件方法'

setTimeout(() => {
        this.$refs.childs.resets() // 调用子组件的方法,重置分页
}, 10)

5.子组件中写好对应的方法

resets () {
      this.currentPage = 1
}

注意：一定要加计时器！！！不然会报错：Error in mounted hook: “TypeError: Cannot read property ‘***’ of undefined”

按照上面的方法，就可以实现vue父页面调用子组件的方法了。打工人，加油2021，继续前进！