更新不相关的 Vue.js 变量导致模板中的输入值消失

Question

我的单个文件 Vue 组件有一个奇怪的问题，当我更新一个不相关的变量（Vue.js 变量）时，我的所有输入（我输入的内容，而不是元素本身）都消失了。

我已经使用 Vue 单文件组件几个月了，我从来没有遇到过这样的事情。这是奇怪的部分，变量按预期成功更新，但如果我在模板中包含变量，那就是所有输入消失的时候。

该功能正在查找“代理”，然后让用户知道已找到多少记录以及他/她是否愿意查看它们。如果用户单击“查看”链接，则会向他们显示一个引导模式，该模式向他们显示记录，以便他们可以选择一个。

这是我已经尝试过的：

1. 从输入中删除所有 id 并仅使用 refs="" 来获取值。

2. 更改“代理”变量名称。想也许它与一些流氓全球或其他东西相冲突。

3. 仔细检查父组件和这个组件没有被重新渲染。我通过在 mount() 函数中放置 console.log() 注释来做到这一点，正如预期的那样，它只渲染一次。

4. 使用 Vue 开发工具扩展查看密钥以确保密钥没有以某种方式被更改。

5. searchAgent()在 a 中执行函数setTimeout(()=>{},5000)以查看我对 _.debounce 的使用是否导致问题。

6. 使用 jquery 从输入而不是 refs 中获取值。

7. 将新记录分配给局部变量agentsArray，然后将其传递给一个函数，该函数将其分配给vue变量“agents”（它基本上是到同一事物的不必要的更长的路由，但我想为什么不尝试一下）

8. 仔细检查了我对“this”的所有使用，以确保我没有不小心使用错误的 this 并导致一些未知的错误。

9. 使用 V-model，但使用它没有帮助，因为我仍然必须在模板的模态内包含“代理”。

10. 仅在 'agents' 不是空数组之后，才使用 v-if 语句在模板中呈现模态 HTML。

11. 更新：根据建议，从函数内部删除了$(document).ready()该mounted()函数。

问题似乎是模板不喜欢在其中包含“代理”变量。当我删除模态容器或仅删除对“代理”的引用时，它会按预期工作。如果我更改变量名称，它并不能解决问题。

关于解决方案的任何想法？我错过了一些明显和愚蠢的东西吗？！