Javascript 如何在Vue中的每个路由上重新初始化包？

我找到了一份工作，我很喜欢。唯一的问题是它需要如下所示进行初始化，这意味着它只被调用一次——当页面被加载时

mounted: () => {
  $(document).ready(function () { 
    $("table").DataTable();
  }
}

我已经把代码放在挂载部分，我还尝试使用created。出于某种原因（可能是渲染顺序），我必须将它保持在ready方法中，否则它不会出现

这给我带来了两个问题。首先，我在多个组件中重用同一个组件作为矩阵视图（它是基于存储动态设置的）。其次，当我从页面导航然后返回时，它不会重新初始化

我应该如何使代码在每次组件进入视图时运行

---

我在谷歌上搜索了一下，但这不是一个常见的问题，我的弹药也没了。我得到的最好的打击是我看不到任何突破性的东西。我还发现，但这只有在我调用这些东西时才有帮助，这似乎不会发生。

我相信您只需要执行以下操作：

mounted () {
    $("table").DataTable();
}

as检测到文档已准备就绪，但在vue情况下，将在实例刚装入后调用，其中el将被新创建的vm.$el替换，后者应等同于document.ready

我还签入了vue 2.x.x，如果您从页面导航然后返回，就会调用它

---

如果此代码依赖于正在加载的数据和组件的重新呈现，则可以使用而不是在数据更改导致重新呈现和修补虚拟DOM后调用的mounted

updated () {
    $("table").DataTable();
}

---

是的，我也这么认为。但这里有一个奇怪的部分——它与您建议的代码不兼容。然而，如果我们稍微延迟一下，它就会延迟。所以这很好：setTimeout（（）=>{$（“table”）.DataTable（）；}，100）；但是如果我们把100和0放在一起，它就不会渲染。这就像有一个微小的延迟（在Vue或DataTable或两者中），我需要等待。我在创建一个基于大量超时的体系结构时遇到了巨大的问题，呵呵。这是一个灾难的配方，也是一个糟糕设计的明显标志。在挂载之后，我应该在何处挂载数据表创建？@KonradViltersten正如您所说，它在延迟后工作，这是否取决于数据负载？如果是这样，您可以尝试在数据更改后调用的钩子，它会导致虚拟DOM被重新呈现和修补。它似乎可以做到这一点。请在答案中加上这个，这样我就可以接受它并+1它。Vue页面上的生命周期图非常误导人——一些钩子被描绘成圆圈，一些被描绘成方框（边框的棕色相同，但我没有看到，因为方框的背景是白色的）。所以我认为只有可用的钩子被挂载和销毁了。我注意到您使用了updated（）{…}，而不是像我通常写的那样，使用updated:（）=>{}。从语义上讲有什么区别吗？@KonradViltersten这很棘手，我能从中理解的是，如果我们在编写时没有

=>

，函数将

这个

定义为全局对象，而不是封闭函数的

这个

。希望这能有所帮助，但我自己对此不是很清楚。