来自子组件的 Vue ref 调用方法返回未定义的方法（v-for）答案

【问题标题】：Vue ref call method from child component returns undefined method (v-for)来自子组件的 Vue ref 调用方法返回未定义的方法（v-for）
【发布时间】：2020-01-09 03:08:54
【问题描述】：

我有这个子组件和一个按钮来触发其中的方法：

      <div v-for="(i,index) in user.usertype.max_user" :key="index" class="d-flex w-50">
        <vue-user-profiles  ref="userProfileComponent"></vue-user-profiles>
      </div>
        <button @click="click">Click</button>

它将以下（组件）渲染特定次数（usertype.max_user 次）

    <template>
  <table class="table">
    <thead>
      <tr>
        <th scope="col">Name</th>
        <td>
          <input
            v-model="userprofile.name"
            type="text"
            class="form-control"
            placeholder="z.B. Max"
          />
        </td>
      </tr>
    </thead>
    <tbody>
      <tr>
        <th scope="row">Age</th>
        <td>
          <input
            v-model="userprofile.age"
            type="text"
            class="form-control"
            placeholder="z.B. 37"
          />
        </td>
      </tr> ...

在这个（子）组件中，我有一个只记录一些虚拟文本 rn 的方法，但我想获取用户在此处输入的所有输入。（它就像一个组配置文件，其中 2 个用户共享一个配置文件，因此如果他选择 2 个用户，则呈现 2 个表单，他可以输入两次相同的内容，每个用户一次，姓名年龄等）

我正在尝试从我的父级调用此方法，在该方法中我循环创建 vue 用户配置文件，例如：

click: function() {
  this.$refs.userProfileComponent.functionInsideChildComponent();
}

我收到的错误是：

Error in v-on handler: "TypeError: this.$refs.userProfileComponent.loger is not a function"

found in

---> <VueProfileEdit> at resources/js/components/VueProfileEdit.vue

感谢任何帮助。我一直卡在这里，提前谢谢。

编辑：澄清：我可以手动让它工作，如果我说 this.$refs.userProfileComponent[0].functionInsideChildComponent();但这，是的，只呈现第一个而不是全部。所以基本上我需要的是：在按钮上单击 - >遍历所有 vue 用户配置文件组件，使用变量索引器将数据保存到任何内容中，以区分表单 1 和表单 2 等，并将其发送给父级我可以用它做点什么。

【问题讨论】：

如果问题已解决，请发布答案。不要在问题本身中回答问题。
而不是在你的问题标题前添加[solved]，你应该接受你自己的答案。
会的，谢谢

标签： javascript vue.js

【解决方案1】：

我得到了这个循环：

  this.$refs.userProfileComponent.forEach(i => i.functionInsideChildComponent());

如果你想在里面使用多个语句或函数，请将其更改为：

this.$refs.userProfileComponent.forEach(i => {
i.functionInsideChildComponent();
console.log("hello");
});

【讨论】：