uniapp获取子组件中的方法，vue

最新推荐文章于 2024-08-23 14:59:06 发布

光头强发工资了

最新推荐文章于 2024-08-23 14:59:06 发布

阅读量2.5k

点赞数 1

分类专栏： uniapp 文章标签： vue uni-app

本文链接：https://blog.csdn.net/weixin_53385000/article/details/116786188

版权

uniapp 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

uniapp获取子组件中的方法，vue

在父组件中调用子组件，并获取使用子组件中的方法，我通过ref来绑定子组件。
代码：
子组件部分

<template>
<view>
    我是子组件
</view>
</template>

<script>

export default {
  data() {
    return {
    };
  },
  methods: {
    init() {
    console.log('在父组件中调用的此方法');
     },
    }
};
</script>
<style>

</style>

父组件中使用：

<template>
<view class="page-wheel">
   我是父组件
  <hxr-wheel  ref="hxrWheel"></hxr-wheel>//通过ref绑定
    <button type="default" @click="wheelStart">使用子组件方法</button>
</view>
</template>

<script>
import hxrWheel from "../../components/hxr-wheel/hxr-wheel.vue";//引入上面的子组件

export default {
  data() {
    return {
    
    };
  },

  components: {
    hxrWheel:hxrWheel
       },
  methods: {
	  
    // 使用子组件中的方法
   wheelStart() {
      this.$refs.hxrWheel.init();
    },
  }
};
</script>
<style lang="scss">

</style>