Vue.js和Firebase-超过最大调用堆栈大小

我正在使用Vue.js和Firebase构建一个小应用程序-现在我想创建一个用户列表“真实数据库”。这确实很好，但只有在登录后刷新它时才可以

[Vue warn]：呈现中出错：“RangeError:超出最大调用堆栈大小”
RangeError:超出了最大调用堆栈大小

我的HTML如下所示：

              <div class="col-12">
                  <h2>Liste</h2>
                  <div class="user-ol">
                    <ol id="example-1">
                      <li v-for="user1 in users[0]">
                       {{ user1.name }}
                      </li>
                    </ol>
                  </div>    
                </div>

以前我的列表元素中也有这个，但是它甚至不能呈现我的页面，并且每2秒就有5个错误

v-bind:class="{ 'green font-weight-bold' : user.active }"

---

我不确定我做错了什么：/

好吧，如果不尝试代码，我就不能肯定你做错了什么，所以我将从侧面给出一些看法

<li v-for="user1 in users[0]">
  {{ user1.name }}
</li>

{{user1.name}

在这里，您正在迭代单个对象的道具。例如，如果用户是类似于

{prop1:'str'，prop2:'str2'}

的对象，则您在v-for中编码类似于

prop1.name

，

prop2.name

。别以为这是你想要的

另外，

用户[0]

最初是未定义的

---

我不确定我提到的事情是否会导致

范围错误：超过了最大调用堆栈大小
。无论如何，我建议从奇怪的用户迭代开始，然后从firebase检查您的事件（尤其是（'value'，…）
回调）。您始终可以添加一些调试打印以了解发生了什么。
db.ref（'users'）。在（'value'），上，…
如何在生成vue对象之前获取数据。我是否只需分配一个previsioly定义的数组并将其传递给vue对象？因此我的用户[0]包含4个用户，每个用户都有名称、角色、电子邮件等。为什么迭代很奇怪？
<li v-for="user1 in users[0]">
  {{ user1.name }}
</li>