Ember.js'deki Bileşenlere Karşı Görünümler

143

Ben ember.js öğreniyorum ve bir görünüm ile bileşen arasındaki farkı anlamaya çalışıyorum. Her ikisini de yeniden kullanılabilir bileşenler yapmanın bir yolu olarak görüyorum.

Ember'in web sitesinden görüntülemeler:

Ember.js'deki görünümler genellikle yalnızca aşağıdaki nedenlerle oluşturulur: -Kullanıcı
etkinliklerinin karmaşık şekilde işlenmesi gerektiğinde -Yeniden kullanılabilir bir bileşen
oluşturmak istediğinizde

Ember'in web sitesindeki bileşenler hakkında:

Bileşen, davranışını JavaScript kullanarak uyguladığınız ve Görünümünü Gidon şablonları kullanarak tanımladığınız özel bir HTML etiketidir. Uygulamanızın şablonlarını basitleştirebilecek yeniden kullanılabilir kontroller oluşturmanıza olanak tanır .

Öyleyse bir görünüm ve bileşen arasındaki temel fark nedir? Ve bir bileşen üzerinde bir görünüm kullanmayı tercih edersem yaygın bir örnek ne olurdu?

javascript ember.js handlebars.js

— Bradley Trager
kaynak

Yanıtlar:

170

Ember.View

Bir Ember.View şu anda W3C tarafından sizin için oluşturulan etiketlerle sınırlıdır. Ancak, uygulamaya özgü HTML etiketlerinizi tanımlamak ve ardından JavaScript kullanarak davranışlarını uygulamak istiyorsanız? Bunu aslında bir Ember.View ile yapamazsınız .

Ember.Component

Bileşenlerin tam olarak bunu yapmasına izin verir. Aslında, W3C'nin şu anda Özel Öğeler spesifikasyonu üzerinde çalıştığı iyi bir fikirdir .

Ember'in bileşenleri uygulaması, Web Bileşenleri belirtimine olabildiğince yakın olmaya çalışır. Bir kez Özel Öğeler tarayıcılarda yaygın olarak kullanılabilir, kolayca W3C standartlarına sizin Kor bileşenlerini göç edebilmek ve iyi yeni bir standart benimsemiş olması olarak onları diğer çerçeveler tarafından kullanılabilmelidir olmalıdır.

Bu bizim için çok önemlidir, bileşenlerin uygulanmasının web platformunun yol haritasına uymasını sağlamak için standart kurumlarıyla yakın bir şekilde çalışıyoruz.

Ayrıca dikkat edilmesi gereken önemli bir nokta da bir Ember.Component öğesinin aslında Ember.View (alt sınıf) olmasıdır, ancak bu tamamen izole edilmiştir . Onun şablonlarda Mülkiyet erişim gidip görünümü nesne ve eylemlerin de ayrıca hedeflenen görünüm nesnesi. Çevreleyen contextveya dışa erişim yoktur, controller tüm bağlamsal bilgiler aktarılır , bu da Ember.View ile gerçekten çevreleyen denetleyiciye erişimi olan bir durum değildir, örneğin bir görünüm içinde this.get('controller')size şu anda görünümle ilişkilendirilmiş denetleyici.

Öyleyse bir görünüm ve bileşen arasındaki temel fark nedir?

Bu nedenle, bileşenlerin yanı sıra ana fark, kendi etiketlerinizi oluşturmanıza izin verir ve gelecekte Özel Öğeler kullanılabilir olduğunda bir noktada da bu öğeleri özel öğeleri destekleyecek diğer çerçevelerde geçirir / kullanır, aslında bir noktada bir kor bileşeni söz konusu uygulama durumuna bağlı olarak biraz eski görünecektir.

Ve bir bileşen üzerinde bir görünüm kullanmayı tercih edersem yaygın bir örnek ne olurdu?

Yukarıdakileri takip etmek, açıkça kullanım durumlarınıza bağlıdır. Ancak, genel bir kural olarak, görünümünüzde çevresindeki denetleyiciye vb. Erişmeniz gerekiyorsa , bir Ember.View kullanın , ancak görünümü izole etmek ve yalnızca bağlamsal agnostik hale getirmek için çalışması gereken bilgileri iletmek istiyorsanız ve çok daha fazla yeniden kullanılabilir, bir Ember.Component kullanın .

Umarım yardımcı olur.

Güncelleme

Road to Ember 2.0 yayınlandığında artık çoğu durumda Görünümler yerine Bileşenleri kullanmanız önerilir.

— intuitivepixel
kaynak

Bileşenlerle ilgili tek endişem, karmaşık hale geldiklerinde. Henüz mantık kısmını oluşturma kısmından nasıl ayıracağımı bilmiyorum. Düzenli görüşlere sahibim, bu ayrılığa sahipsiniz ve mantığı denetleyiciye koyabilirsiniz, ancak bileşenle, içinde çok karmaşık ve belki de büyük bir karışıklık yaşayacağınızı söyleme eğilimindeyim. Bileşenler için özel bir denetleyici benzeri tanımlamanın mümkün olup olmadığını biliyor musunuz? Ya da belki de bileşenler karmaşık grafik unsurları yönetmek için tasarlanmamıştır.

— sly7_7

@ sly7_7, evet anladım. Ama bir bileşeni kara kutu olarak düşünürdüm, sadece geçtiği verilere dayanarak hareket ederdim. Ve ne yaptığına bağlı olarak bu çok hızlı bir şekilde karışıklık haline gelebilir. Adanmış bir denetleyici mutlak mantıklı olurdu ve bileşenlerin içine mantık enjekte edilebilirse işe yarayabileceği bir yol olurdu, ancak bildiğim kadarıyla bileşenler tasarımla kor kabının bir parçası değil, ama gelecekte değişebilir tam olarak böyle bir şeyi çöz. Yine de iyi bir nokta!

— sezgiselpiksel

herhangi bağlamaları gidebilir dışarı bir bileşenin? IE, bir bileşenin blok biçimiyle bloktaki içerik öğeleri bileşenin özelliklerine bağlanabilir mi yoksa bu durumda bir görünüm kullanmalı mıyım?

— Michael Johnston

ah, evet yapabilirler. {{view.xxxx}}görünümdeki ile aynı bileşende çalışır.

— Michael Johnston

Tom Dale'in bu konudaki yorumları: ember.zone/the-confusion-around-ember-views-and-components/…

— Akshay Rawat

Cevap basit: bileşenleri kullanın

Ağustos 2013'te kaydedilen bir eğitim videosuna göre, Yehuda Kats ve Tom Dale (Ember Core Team Üyeleri), bir çerçeve geliştiricisi olmadığınız sürece izleyicilere görüntüleme kullanmamalarını söyledi. Gidonlarda birçok iyileştirme yaptılar ve Bileşenleri tanıttılar, bu yüzden görünümler artık gerekli değil. Görünümler dahili olarak {{#if}} ve {{outlet}} gibi şeylere güç sağlamak için kullanılır.

Bileşenler ayrıca tarayıcıda oluşturulacak Web Bileşeni standardını da taklit eder, bu nedenle konforlu Ember Bileşenleri oluşturmanın birçok yan faydası vardır.

2014-11-27 Güncellemesi

Ember 2.0, denetleyici / görünüm yerine bir rota girildiğinde Yönlendirilebilir Bileşenler kullanacağından, artık görünümler yerine bileşenleri kullanmak daha da önemlidir. Uygulamanızı gelecekte kanıtlamak için Views'dan uzak durmak en iyisidir.

Kaynaklar:

Ember Yolu 2.0: https://github.com/emberjs/rfcs/pull/15
Ember 1.x kodunuzu geleceğe hazırlayın: https://gist.github.com/samselikoff/1d7300ce59d216fdaf97
Görünüm yok, yalnızca bileşen (Tom Dale): https://speakerdeck.com/tomdale/ember-2-dot-0-in-practice?slide=27

— Johnny Oshika
kaynak

"Bir görünüm kullanmanız gerektiğini düşünüyorsanız bunun yerine bir Bileşen kullanın." korkunç bir öğüttür ve bileşenlerin içerdiği izolasyonun anlaşılamamasına ihanet eder.

— jmcd

@jmcd, bu yorum çerçeve geliştiricilerin kendilerinden gelse de, ben çıkardım.

— Johnny Oshika

Kaynağı buldum: Gaslight video eğitimi, video 10.3 Bileşenler Q&A @ 26m mark. Tom diyor ki: '' Bu örnekler yazıldığından beri ... bu örnekler yazıldığında var olmayan Bileşenleri ekledik. Genel olarak,

— Views'un

@jmcd, Bu videoda @ 26:15, Tom "temelde Görünümleri kullanma" diyor. Ayrıca, aynı videoda 30 metreye atlarsanız, Yehuda Katz diyor ki: "Görünüm temelde bir iç uygulama detayıdır ... bir Görünüm kullanabilirsiniz, ancak daha sonra bir çerçeve geliştiricisisiniz. sizin için, View kullanan ve View'a en yakın olan ancak daha iyi anlambilimine sahip olan sizin için oluşturduğumuz bileşen Bileşen'dir. Daha önce kullanabileceğiniz bir Görünüm, Bileşen iyidir. "

— Johnny Oshika

Şu v2.xanki haliyle - mevcut kararlı sürüm olarak - görüşler tamamen kullanımdan kaldırıldı. Görünümlerin Ember 2.0 API'sından kaldırıldığı söyleniyor .

Dolayısıyla, {{view}}Ember 2.0'da anahtar kelime kullanmak bir iddiayı tetikleyecektir:

Onaylama Başarısız Oldu: {{view}}Ember 2.0'da kullanarak veya buna dayalı herhangi bir yol kaldırıldı

Ember 2.0'da görünümler kullanmanız gerekiyorsa , sürüm 2.4'e kadar Ember ile uyumlu olacak ember-legacy-views eklentisini kullanabilirsiniz .

Özetlemek gerekirse, bileşenler mevcut (görünümler kaldırılıyor) ve gelecek - denetleyicilerin yerini alacaklar. Bkz. Yönlendirilebilir Bileşenler RFC .

— Daniel Kmak
kaynak