計算されたプロパティで$ refsを使用する

Question

計算中の$refsにアクセスするにはどうすればよいですか？計算されたプロパティが最初に実行されるときは、常に未定義です。

Answer 1

私自身の質問にここで答えると、どこでも満足のいく答えが見つかりませんでした。場合によっては、いくつかの計算を行うためにdom要素にアクセスする必要があります。うまくいけば、これは他の人に役立つはずです。

コンポーネントがマウントされると、Vueを計算してプロパティを更新する必要がありました。ちょうど支えるためにいくつかのデータを渡す必要がある私のような他のユーザーのために

Vue.component('my-component', { 
    data(){ 
     return { 
      isMounted: false 
     } 
    }, 
    computed:{ 
     property(){ 
      if(!this.isMounted) 
       return; 
      //$refs is available 
     } 
    }, 
    mounted(){ 
     this.isMounted = true; 
    } 
}) 

Answer 2

あなたがupdated()フックを使用することができv-if後$refsが必要な場合は、私はdata代わりのcomputed

Vue.component('my-component', { 
    data(){ 
     return { 
      myProp: null 
     } 
    },  
    mounted(){ 
     this.myProp= 'hello'  
     //$refs is available    
     // this.myProp is reactive, bind will work to property 
    } 
}) 

Answer 3

を使用。

<div v-if="myProp"></div> 


updated() { 
    if (!this.myProp) return; 
    /// this.$refs is available 
},