Üst öğenin yüksekliğine bağlı olarak satır içi stilleri kullanarak bir öğenin dolgusunu dinamik olarak ayarlamaya çalışıyorum. Bunun için kullanıyorum:
<div class="stock-rating positive" ref="stockRating">
<div class="stock-rating-start-end" v-bind:style="{ paddingTop: paddingTop }">
<div>{{ rating.value_start }}</div>
<div>to</div>
<div>{{ rating.value_end }}</div>
</div>
</div>
paddingTophesaplanmış bir özellik olacaktır. Ancak, bunu hesaplamadan önce, aslında üst öğenin ( stockRating) $ ref değerine erişmem gerekiyor . Ancak, $ refs nesnesi onu içeriyor gibi görünse bile, hesaplanan özellikte bulunmaz.
paddingTop : function(){
console.log(this.$refs); console.log(this.$refs.stockRating);
/*computation here*/
}
console.logÇıktısı:

Neden olduğu this.$refs.stockRatingtakdirde tanımsız this.$refsvardır stockRatingmülkiyet ve bunu kuyunun olarak doğru öğeleri içerir görüyor musunuz? Bunu nasıl çözerim?