時計のVueの詳細な使用(転載)

VUEでは、データの変化に対応した腕時計。約3の使用状況を監視します。次のコードは、簡単な使い方の時計です。

<input type = "text" Vモデル= "cityName" />
コードをコピー
新しいヴュー({ 
  エル: '#root'、
  データ:{ 
    cityName: '上海' 
  }、
  腕時計:{ 
    cityName(NEWNAME、OLDNAME){ 
      // ... 
    } 
  } 
})
コードをコピー

、モニター・ハンドラに直接書き込むたびにcityName値の変化を聞いて、機能を実行します。文字列は、リスナーメソッド名データの後ろに直接添加してもよいです。

時計:{ 
    cityName: 'nameChange' 
    } 
 }

即時およびハンドラ

この特性最初の結合の値は、関数モニタを行わない場合、つまり、時計を使用する場合、値だけ変更が行われます。私たちは時に第一の結合値も機能を実行する必要がある場合は、すぐにプロパティを使用する必要があります。

そのような子コンポーネントに親コンポーネントが動的場合など、伝統的な価値観は、親アセンブリのデフォルト値を取得するのは初めてのためのサブアセンブリの小道具にも機能を実行する必要が来たとき、あなたはtrueに即時のセットが必要です。

コードをコピー
新しいヴュー({ 
  エル: '#root'、
  データ:{ 
    cityName: '' 
  }、
  見て:{ 
    cityName:{ 
      ハンドラ(NEWNAME、OLDNAME){ 
        // ... 
      }、
      即時:真
    } 
  } 
})
コードをコピー

私たちは関数が実際にハンドラメソッドを記述している書き込み前にリスナー書かれたフォームの背後にあるデータオブジェクトは、それは、ハンドラメソッドと即時が含まれています。

当面は、第1のデータの変化のように、値がfalseで、ハンドラは、値がtrueで、それはそれは、時計で宣言されたときに、すぐにハンドラメソッドを実行することを意味するかどうか、時間を見て、時計の一般的な使用結合を表す場合実行ハンドラの前に。

深い

必要性は、オブジェクトの変更を監視する場合は、従来の方法は、データ内のデータのみが変更を監視できるようにするには、監視対象の属性の変更内のオブジェクトを見ることができない、あなたは深い深度モニタオブジェクトの属性を必要とします。

<input type = "text" Vモデル= "cityName.name" />
コードをコピー
新しいヴュー({ 
  エル: '#root'、
  データ:{ 
    cityName:{ID:1、名前: '上海'} 
  }、
  腕時計:{ 
    cityName:{ 
      ハンドラ(NEWNAME、OLDNAME){ 
      // ... 
    }、
    深いです:真、
    即時:真
    } 
  } 
})
コードをコピー

深い設定する:本当、あなたは大規模なオブジェクトのプロパティは、各プロパティの値の変化はハンドラを実行されるすべてのプロパティがリスナーにcityName結合される場合には、変更cityName.name、を聞くことができます。あなただけのモニターオブジェクトのプロパティ値が必要な場合は、次の最適化を行うことができます:文字列モニターオブジェクトのプロパティを使用します。

コードをコピー
時計:{ 
    'cityName.name':{ 
      ハンドラ(NEWNAME、OLDNAME){ 
      // ... 
      }、
      深い:真、
      即時:真
    } 
  }
コードをコピー

これは、オブジェクトプラスリスナーの特定の属性を与えます。

変更アレイは(一次元、多次元)の深さを監視する必要はありません、属性変更内のオブジェクトは、オブジェクトの配列深い深度監視に必要とされます。

おすすめ

転載: www.cnblogs.com/xiaozhumaopao/p/11077234.html