1. はじめに数日前、仕事中に問題に遭遇しました。vue3 で reactive を使用して生成されたレスポンシブ配列をクリアするにはどうすればよいでしょうか? もちろん、通常は次のようにクリアします。 配列を[1,2,3]とします。 配列 = []; ただし、この方法は、次のようなリアクティブ プロキシで使用する場合、まだ少し問題があります。 配列をreactive([1,2,3])とします。 watch(()=>[...配列],()=>{ console.log(配列); },) 配列 = リアクティブ([]); 明らかに、元の応答オブジェクトへの参照が失われるため、監視は直接失われます。 2. データを消去するいくつかの方法もちろん、10 年のコーディング経験があり、何年も怠けてきた私としては、すぐにいくつかの解決策を思いつきました。 2.1 ref() の使用ref を使用するのが最も簡単な方法です。 定数配列 = ref([1,2,3]); ウォッチ(配列,()=>{ console.log(配列.値); },) 配列の値 = []; 2.2 スライスの使用名前が示すように、slice は配列をスライスして新しい配列を返します。これは、Go 言語の slice に多少似ています。もちろん、React を使用したことがある友人は、slice をよく使用するはずです。配列をクリアするには、次のように記述するだけです。 定数配列 = ref([1,2,3]); ウォッチ(配列,()=>{ console.log(配列.値); },) 配列の値 = 配列の値のスライス(0,0); ただし、ref の使用には注意してください。 2.3 長さは0に割り当てられます個人的には、長さを 0 に直接割り当てるこの方法を好みます。 定数配列 = ref([1,2,3]); ウォッチ(配列,()=>{ console.log(配列.値); },{ 深い:本当 }) 配列の値の長さ = 0; さらに、これは一度だけトリガーされますが、深く開くには時計に注意を払う必要があります。 ただし、この方法では、リアクティブを使用する方が便利であり、deep を有効にする必要はありません。 定数配列 = リアクティブ([1,2,3]); watch(()=>[...配列],()=>{ console.log(配列); }) 配列の長さ = 0; 2.4 スプライスの使用副作用関数 splice も解決策の 1 つです。この場合、reactive も使用できます。 定数配列 = リアクティブ([1,2,3]); watch(()=>[...配列],()=>{ console.log(配列); },) 配列.splice(0,配列.長さ) ただし、ウォッチは複数回トリガーされることに注意してください。 もちろん、ref を使用することもできますが、この場合は deep をオンにする必要があることに注意してください。 定数配列 = ref([1,2,3]); ウォッチ(配列,()=>{ console.log(配列.値); },{ 深い:本当 }) 配列の値の連結(0,配列の値の長さ) しかし、ref も reactive と同様に複数回トリガーされていることがわかります。 3. 結論これで、Vue で配列をクリアするいくつかの方法についての記事は終了です (要約)。Vue で配列をクリアする方法の詳細については、123WORDPRESS.COM の以前の記事を検索するか、次の関連記事を引き続き参照してください。今後とも 123WORDPRESS.COM をよろしくお願いいたします。 以下もご興味があるかもしれません:
|
<<: nginx「504 ゲートウェイタイムアウト」エラーを解決する
<br />原文: http://www.mikkolee.com/13私は最近、ver...
導入js コード文の末尾にセミコロンを追加しても追加しなくても問題ありません。一般的に、チームで開発...
問題コードuseEffectによって発生したクロージャの問題コードを見てみましょう 定数 btn =...
目次使用されるPygame関数スクリーンの作成ヘビの作成ヘビを動かすゲームオーバーの処理食事を増やす...
目次1. はじめに2. 自己増分ストレージの説明3つの自己付加価値修正メカニズム4. 自己評価を修正...
yum で vsftpd をインストールします [root@localhost など]# yum -...
ポートが占有されているかどうかは、これまで一度もわかりませんでした。多くの人に尋ねて、ようやくわかり...
Web ページの外観はレイアウトに大きく左右されます。ページ内に長い段落のテキストがある場合、通常は...
1. なぜこの記事を書くのですか?重複リクエストの処理に関する記事をたくさん読んだことがあるでしょう...
MySQLテーブルパーティショニングプログラムを変更する方法1. サブテーブルの実装の原則は次のとお...
公式の MySQL ダンプ ツールで、特定のデータベースのみを復元するにはどうすればよいですか?完全...
目次序文なぜユニットテストを導入するのですか?ユニットテストの概要テスト開発パターン1. テスト駆動...
【1】存在するループを使用して外部テーブルを 1 つずつクエリし、各クエリの存在する条件ステートメン...
コンセプト紹介: 1. px (ピクセル):仮想的な長さの単位で、コンピュータ システムのデジタル画...
デザイナーは世界で最も繊細で感情的な人々だと私はいつも感じています。私がこう言うときに優越感を感じる...