我正在使用Nodejs和Vuejs 3创建一个应用程序。在这个应用程序中，我做了一个侧边栏，从路由文件中获取所有链接并呈现它们。此侧栏包含在一个组件中，该组件是其他递归链接组件列表的父组件。
由于链接是递归的，而且很多，我发现仅使用Vue很难处理每个链接上的类切换(活动、显示、折叠等)并将它们相互关联(如果一个是活动的，其他不应该是活动的)。我应该使用querySelector或任何框架，如JQuery来处理它们，还是我应该尝试坚持使用纯Vuejs方法?
编辑:我不想收集社区对它的意见。我的目的是从实用的角度理解为什么我应该或不应该在Vue的"外部"操作DOM。
如果你使用的是Vue，那么让它来控制DOM;直接瞎胡闹只会制造矛盾和苦恼。
(这同样适用于其他SPA框架，如React和Angular。)
不碰DOM的主要原因是Vue通过自己修改DOM来工作，并期望完全控制它:在渲染组件时，框架会删除旧的DOM元素，添加新元素，更新事件绑定等;而且很多都被优化为只更新需要更新的DOM节点。
如果你在Vue不知道的情况下直接进行修改，那么很可能你自己的修改会在下次Vue需要渲染时被覆盖，或者你的修改会覆盖Vue所依赖的绑定。
如果你对Vue的生命周期非常了解，并且知道如何控制何时渲染和不渲染，那么可以将两者一起使用-但即使如此，它仍然不是一个好主意。Vue和jQuery做了非常相似的事情，但是用完全不同的方式。在jQuery中，你构建页面，然后使用DOM遍历和事件处理程序来修改它;一切都在DOM中。在Vue中，你建立了一堆组件来管理它们自己的状态和渲染;DOM基本上是应用程序状态的一个副作用。
试图同时使用它们，您将失去它们各自的大多数优点，并且在必须管理两种相互竞争的状态理论和呈现管理(更不用说处理它们之间的通信数据)时引入了许多复杂性。每次我考虑在Vue应用程序中嵌入jQuery小部件时，结果证明直接在Vue中重写小部件要容易得多。
这确实意味着要改变许多使用DOM的习惯，这些习惯可能是您从过去的jQuery工作中建立起来的。这听起来像是你试图绘制整个DOM，然后在其中构建你的控制结构，如果你习惯了jQuery，这是一种自然的思考方式;在Vue中，您需要将所有这些逻辑构建到组件中，以便框架可以为您完成工作。我建议为一个链接制作一个Vue组件，该组件管理其自己的状态为打开/关闭/活动等，只有当"打开"时才递归到其子节点。然后只需在导航数据的顶部调用它一次，而不是像在jQuery中那样在事后直接管理整个树。