最近、プロジェクトで Vue を使用していますが、開発プロセス中に、配列内の要素を削除すると、その要素の背後にある要素が再レンダリングされないことがわかりました。
HTML コードは次のとおりです:
2 つのコンポーネントがあります: 1 つはメイン コンポーネントで、すべてのコンテンツ コンテナを含めるために使用され、もう 1 つはサブコンポーネントで、コンテンツの表示に使用されます。 
js コードは次のとおりです: 
Vuex ストアもあります:
通常、サブコンテナを削除するときは、vue の配列のオーバーライド メソッドである splice を直接使用して削除できるはずです。 ＃＃＃のように：＃＃＃
リーリー
しかし、それを使用した後、要素を削除すると、この要素の背後にある要素が再ロードされ、再レンダリングされず、ページ内の vue ロジックが正常に実行されないことがわかりました。
いろいろ方法を試しても解決せず、どうやら要素を削除すると後続の要素の添え字が変わり、要素内の内容が再読み込みされても表示されないようです。
したがって、私の最終的な解決策は、上の図に示すように、要素を直接削除するのではなく、
を使用することでした。state.Content.splice(i,1,null);
メソッドは、配列の配置を変更せずに配列内の要素を空に設定することで、最終的に問題を解決します。
しかし、この解決策は症状を治療するだけで根本的な原因は治療できないため、私の質問にうまく答えることができません。そこで専門家の皆様にお聞きしたいのですが、
これを解決するより良い方法はありますか?
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
配列のクローンを作成し、この配列で操作した後、この配列を前の配列に割り当てようとすると、間違いなく Vue の再レンダリングがトリガーされます。
PS: ちなみに、Vue が再レンダリングするかどうかは、依存するデータが変更されたかどうかによって決まります。そのため、通常の方法で参照型データ (配列、オブジェクトなど) を追加または削除した場合、Vue は再レンダリングしない可能性があります。データの変更を検出するには、上記で説明した (単純かつ大雑把な) 方法を使用するか、Vue が提供する などの方法を使用します。
削除したら、state.Contentを再割り当てしてみることができます
リーリー私は通常これを行います
state.content = state.content.map( e=> {
})