2016-09-13 50 views
15

JSX ne anlama geliyor? ReactJS'nin artan popülaritesiyle oldukça popüler hale gelen ECMAScript'e XML benzeri bir sözdizimi uzantısı olarak tanımlanan JSX'e başvuruyorum.JSX ne anlama geliyor?

cevap

21

JSX J ava S cript x ML anlamına gelir. React ile, elemanlar ve bileşenler için XML benzeri bir kod uzantısıdır. docs tepki ve bahsettiğin gibi başına:

JSX herhangi tanımlı semantik yukarıda alıntı itibaren

olmadan ECMAScript'e bir XML benzeri sözdizimi uzantısıdır, sen JSX tanımladığınız olmadığını görebilirsiniz semantik, basitlik ve zarafet için XML benzeri bir kod yazmanıza izin veren bir JavaScript uzantısıdır ve daha sonra JSX'i React.createElement ile salt JavaScript işlev çağrılarına aktarırsınız. Tepki Öğreticisi Başına:

JSX, JavaScript'e XML sözdizimi ekleyen bir ön işlem adımıdır. JSX olmadan React'ı kesinlikle kullanabilirsiniz ancak JSX React'ı çok daha zarif hale getirir.

XML gibi, JSX etiketlerinde de bir etiket adı, öznitelik ve çocuklar bulunur. Bir öznitelik değeri tırnak içine alınmışsa, değer bir dizedir. Aksi halde, değeri parantez içine alın ve değer ilişikteki JavaScript ifadesidir.

JSX'deki herhangi bir kod, düz JavaScript/ECMAScript'e dönüştürülür. Login adlı bileşeni düşünün. Şimdi JSX ile çok gibi işlemek:

<Login foo={...} bar={...} /> 

Gördüğünüz gibi, JSX sadece tepki bileşenleri ve unsurları temsil eden etiketleri XML benzeri sözdizimi sahip olmasını sağlar. Saf JavaScript içine transpiled oluyor:

React.createElement(Login, { foo: ..., bar: ... }); 

Sen at the docs fazla bilgi bulabilirsiniz.

+0

Detaylı açıklama için teşekkür ederiz. Bu kesinlikle aradığım cevap türüdür. – user2977636

4

Sözdizimi uzantısı için JSXJavaScript standı. XML'e benzer. React ile basit bir JSX sözdizimi dönüşümü kullanabilirsiniz.