vueで出会った穴

1528 ワード

1つはeventHubのピットです–繰り返しリスニングの問題:ソリューションリスニングの前にoffを落とす
2ルーティングのピット–replaceを付けないと2つのページがジャンプし、親ページに正常に戻ることができません.
3 vuejsはdata中の配列のオリジナルメソッドをカプセル化しているので、配列を変更するとビューの更新をトリガーできますが、以下の2つの場合はビューの更新をトリガーできません.
1              ,  vm.items[0] = {title: 'title'}

 2            ,  vm.items.length = 0

ソリューション第1のvueにはsetメソッドvmが提供する.items. set(0,{title:‘title’})またはvm.$set(‘items[0]’,{title: ‘title’})
もう1つのリストをレンダリングするときのパフォーマンスのテクニックは、配列自体に一意の識別idが付いている場合です.
itmes: [ {_id: 1,title: ‘title1’} {_id: 2,title: ‘title2’} {_id: 3,title: ‘title3’} ]
レンダリング時にtrace-byで配列に一意の識別子を設定すると、vuejsはレンダリング中に既存のオブジェクトの役割ドメインとdom要素をできるだけ繰り返します.
  • は現在、key=’id’、すなわちbind
  • を使用するようにアップグレードされている.
    4 v-textパラメータはstringであり、要素のtextContentを更新する役割を果たす.{{}}テキスト補間自体もこれを行うが,v-textの利点は,未コンパイル前のフラッシュ問題を回避できることである.
    ライフサイクルbeforeMountの間に{msg}}を直接使用すると,現在のmsgデータはまだ{msg}}にコンパイルされておらず,ユーザは一瞬の{msg}}を見ることができる.
    there is a messageにフラッシュしてv-textを使うとこの問題はありません
    5 v-elとv-ref
    v-elコマンドはdom要素にインデックスを登録し、DOM要素に直接アクセスできます.構文的には、所属するインスタンスの$els属性で呼び出すことができます.たとえば
    there is a el demo
    vm.$els.demo.innerText//-> there is a el demo
    HTMLでは大文字と小文字を区別しないため、v-elではラクダ式のネーミングを使用すると自動的に小文字に変わりますが、中線を使用して大文字のアルファベットを接続できます.
    there is a camelcase
    もしあなたがこのように書くならば、持つ時ただ
    vm.$els.camelcase.innerText:小文字で持つ
    中線で線を引くと
    there is a camelcase
    これでまたお持ちになると、お気に入りのアルパカ式が便利に使えます
    vm.$els.camelCase.innerText
    はい、v-elを紹介しました.実はv-refはそれと似ています.v-refがサブアセンブリに作用しているだけです.