Computed özelliği genellikle diğer bazı verilerden veri hesaplamak için kullanılır. Yanıt verebilirlikleri ile tanınırlar çünkü bazı hesaplanan özelliklerde bir değişken değiştiğinde tüm özellik yeniden hesaplanır. Bu gönderi, parametrenin hesaplanmış bir özelliğe nasıl iletileceğini ve Vue’nun nasıl kullanılacağını öğrenecek. ile sayılır Laboratuvarlar. Hesaplanan özelliğe parametre aktarmaya başlamadan önce, örneğe bakarak hesaplanan özellikleri anlayalım.
örnekler
Bir Vue bileşeninde “firstName” ve “lastName” adlı iki değişkenimiz olduğunu varsayalım:
// ..
veri(){
dönüş{
ilk isim:“”Ve
soyadı:“”
}
}Ve
// ..
hesaplanmış özellik
‘FirstName’ ile ‘lastName’i birleştirecek ‘fullName’ özelliğini hesaplamak ve ‘FirstName’ ve ‘lastName’ değişkenlerinden herhangi biri değiştiğinde fullName değerini yeniden hesaplamak istiyoruz. Bu nedenle, tam ad hesaplaması için hesaplanan özellik şöyle olacaktır:
// ..
hesaplanmış:{
ad soyad(){
dönüşnasılsın bügün.ilk isim+“+nasılsın bügün.soyadı;
}
}
// ..
Şimdi bazı giriş alanları oluşturalım ve “ad” ve “soyad” değişkenlerini giriş alanlarına bağlayalım ve ayrıca “p” etiketindeki “fullName” özelliğini bağlayarak ilk animedeki değişiklikle ilişkili ani değişikliği gösterelim. Başlık. Bu bileşenin HTML kısmı şöyle görünecektir:
tamam! Tüm bu kurulumları yaptıktan sonra web sayfamıza bir göz atalım.
Doğru kodu yazıp başarıyla çalıştırdıysanız, web sayfanızda her iki giriş alanına da sahip olmalısınız. Ad ve soyadını yazmaya çalışalım ve “fulName” özelliğinin sayılıp sayılmadığına bakalım.
Yukarıdaki ekran görüntüsünde, Vue.js’nin hesaplanmış özellik ile muhteşem etkileşimini görebilirsiniz. Bunun bir değişkeni izleyip başka bir değişkenin değerini değiştirmekle aynı şey olmadığına da tanıklık edebilirsiniz. Ancak, hesaplanan özelliğe dahil edilen her değişkenin kaydını tutar ve “soyadı”nı yeniden hesaplar. Hesaplanan özelliğe parametreleri nasıl iletebileceğimizi ve bunları nasıl kullanabileceğimizi görelim.
Hesaplanan özelliğe parametreleri iletin
Hesaplanan özelliğe parametreleri iletmek için, fonksiyona yaptığımız gibi sadece parametreleri iletiyoruz. Örneğin, şablonda, ‘lastName’ değişkenine bağlandığımızda, bir dize iletmek istiyoruz, dolayısıyla bileşenimizin şablon kısmı şöyle olacaktır:
Şimdi, hesaplanan özellikte, iletilen parametre aşağıdaki söz dizimi kullanılarak kullanılabilir.
hesaplanmış:{
ad soyad(){
dönüş Mesaj 1 =>{
dönüş ${İleti} ${nasılsın bügün.ilk isim} ${nasılsın bügün.soyadı}“
}
}
}
Bu şekilde hesaplanan parametreye bir parametre iletebilir, onu özelliğe ekleyebilir ve kullanabiliriz.
Web sayfamıza tekrar bakıp ad ve soyad yazarsak aynı işlevsellik ve etkileşimi sağlayabilirsiniz ancak bu kez bir parametre iletilir.
Hesaplanmış bir özellik parametresini iletmek ve kullanmak bu kadar basit ve kolaydır.
Çözüm:
Hesaplanan özellik, Vue.js’deki çok güçlü bir özelliktir ve bağımlılıkları değiştiğinde onu değiştirmemiz gerektiğinde kullanışlı olduğunu öğrendik. Hesaplanan özellikte parametreyi iletmeyi ve kullanmayı öğrendik.
Diğer gönderilerimize göz at
[wpcin-random-posts]
İlk Yorumu Siz Yapın