jquery hide（）ramdonly

Question

最近、私は奇妙な問題に遭遇しました。私はいくつかのjqueryコードをvueコンポーネントのメソッドオプションで記述しました。 jquery hide（）関数はすべて正常です。

example1のようなコードを書くと、非常に短時間で ".edit-box"が消えてから表示されます（点滅します）。私は例2のように私のコードを記述する場合、それは私のコードをexcuteする時間について何かあれば

//my html 
<p class="move-up-btn" v-on:mousedown.stop="moveUpLib">...</p> 

//example 1 
Vue.component('...',{ 
    template:'...', 
    methods:{ 
     moveUpLib:function(){ 
      (this).$parent.moveUpLib(); 
      $('.edit-box').hide(); 
     }, 
     } 
    }) 

は、「.editボックス」disppears完全

//example 2  
    Vue.component('auxiliary',{ 
    template:'#auxiliary', 
    methods:{ 
     moveUpLib:function(){ 
      alert('hi'); 
      (this).$parent.moveUpLib(); 
      $('.edit-box').hide(); 
     }, 
    } 
    }) 

は、だから私は疑問に思います。そして私はこのように私のコードを変更しました。私は

• 1理由例1つのdoes'tを知りたい

  //example3 
      Vue.component('...',{ 
      template:'...', 
      methods:{ 
       moveUpLib:function(){ 
        (this).$parent.moveUpLib(); 
        setTimeout(function(){ $('.edit-box').hide(); }, 1000); 
       }, 
       } 
      }) 
  

  ：私は「サーバが404の状態で応答（見つかりません）リソースのロードに失敗しました」され得ることをしかし、すべての仕事

• 2私は のVueのメソッドオプション内のsetTimeoutを使用できない理由
• 3 I「の.editボックス」を取得警告なし を消えることができますどのよう

誰でも助けることができれば幸いです！

Answer 1

なぜこれにjqueryを使いたいのですか？ Vueはこれを扱う独自の（そしてより良い：-P）方​​法を持っています。

Vueの哲学（角度とreacのものなど）はDOMに直接触れることはまれではなく、libararyはDOMをコンポーネントの状態/データに合わせて変更します。

HTML：

<textarea v-show="showEditBox" class="edit-box"><textarea> 

JS

data: function() { 
    return { showEditBox: true } 
}, 
methods: { 
    moveUpLib: function() { 
    //other stuff... 
    this.showEditBox = false // <= hides the textarea 
    } 
}