?我正在使用 Nodejs 和 Vuejs 3 創建一個應用程式。在這個應用程式中，我制作了一個側邊欄，它從路由檔案中獲取所有鏈接并呈現它們。此側邊欄包含一個組件，該組件是其他遞回鏈接組件串列的父級。
?由于鏈接是遞回的并且很多，我發現很難處理每個鏈接上的類切換（活動、顯示、折疊等）并將它們相互關聯（如果一個是活動的，其他不應該是）使用只有 Vue。我應該使用 querySelector 或任何框架（如 JQuery）來處理它們，還是應該嘗試堅持使用純 Vuejs 方法？
編輯：?我不想收集社區對此的意見。我的目標是務實地理解為什么我應該或不應該在 Vue 的“外部”操作 DOM。
uj5u.com熱心網友回復：
如果你使用 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 中那樣在事后直接管理整個樹。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/327694.html