javascript – Vue löscht Array-Elemente, was dazu führt, dass verbleibende Elemente nicht erneut gerendert werden
Ich habe Vue kürzlich in einem Projekt verwendet, aber während des Entwicklungsprozesses habe ich festgestellt, dass die Elemente hinter dem Element nicht neu gerendert werden, wenn ich ein Element im Array lösche.
Der HTML-Code lautet wie folgt:
Es gibt zwei Komponenten: eine ist die Hauptkomponente, die alle Inhaltscontainer enthält, die andere ist die Unterkomponente, die zum Anzeigen von Inhalten verwendet wird. 
js-Code lautet wie folgt: 
Dann gibt es auch einen Vuex-Store:
Normalerweise sollten Sie beim Löschen eines Untercontainers in der Lage sein, Splice, die überschriebene Methode von Arrays in Vue, direkt zu verwenden, um ihn zu löschen.
Zum Beispiel:
state.Content.splice(i,1);Aber nach der Verwendung habe ich festgestellt, dass nach dem Löschen eines Elements die Elemente hinter diesem Element neu geladen und nicht erneut gerendert werden und die Vue-Logik auf der Seite nicht normal ausgeführt wird.
Nach dem Ausprobieren verschiedener Methoden gibt es immer noch keine Lösung. Es scheint, dass sich beim Löschen des Elements der Index des nachfolgenden Elements ändert, was dazu führt, dass der Inhalt im Element neu geladen, aber nicht gerendert wird.
Meine endgültige Lösung bestand also, wie im Bild oben gezeigt, darin, das Element nicht direkt zu löschen, sondern
zu verwendenstate.Content.splice(i,1,null);
Die-Methode setzt die Elemente im Array auf leer, ohne die Anordnung des Arrays zu ändern, und löst so letztendlich das Problem.
Aber diese Lösung kann nur die Symptome, nicht aber die Grundursache behandeln und kann meine Fragen nicht sehr gut beantworten.
Deshalb möchte ich alle Experten fragen: Gibt es einen besseren Weg, das Problem zu lösen?
