uniapp通过ref获取自定义子组件的方法失败

uniapp通过ref获取自定义子组件的方法失败
父组件不能成功获取到子组件,获取回来一个组件数组,很奇怪。

报错内容

img

父组件点击方法:

img

父组件应用子组件

img

子组件定义方法:

img

用原生的方法去获取document.getElementById("id");

这个问题可以变成vue中父组件调用子组件的方法

<template>
  <div>
    <CreatorGroup ref="refCreatorGroup"></CreatorGroup>
  </div>
</template>

<script>
export default {
  mounted() {
    console.log('mounted');
    this.$nextTick(() => {
      console.log('next tick');
      const creatorGroup = this.$refs.refCreatorGroup;
      // 在这里可以使用 creatorGroup 对组件进行操作
    });
  }
};
</script>

在DOM更新后执行回调函数

因为你那个组件for循环了所以你获取的是全部的同名的ref组件你动态设置绑定ref就行了,保证ref的唯一性就可以了

你这个组件是for循环数来的,就是有多个CreatorGroup,this.refs.CreatorGroup获取到的是一个数组,你需要更具index来判断执行哪一个CreatorGroup组件的方法creatorGroup [index].resetBar()