React တွင် JSX ဘာသာစကား မိတ်ဆက်

JSX ဘာသာစကားသည် သာမန် JavaScript ဘာသာစကားဖြစ်သော်လည်း ကုဒ်ထဲတွင် ကိုးကားချက်များ မပါဘဲ တိုက်ရိုက်အမှတ်အသားများ (tags) ရေးသားနိုင်ရန် ခွင့်ပြုသည့် အပိုထပ်ဆောင်းအချို့ပါဝင်သည်။

အမှတ်အသားများကို return မှတစ်ဆင့် ပြန်ပေးနိုင်ပါသည်:

function App() {
	return <div>
		text
	</div>;
}

အမှတ်အသားများတွင် attribute များ (ဂုဏ်အင်္ဂါများ) ပါနိုင်ပါသည်:

function App() {
	return <div class="eee">
		text
	</div>;
}

အမှတ်အသားများကို ကိန်းရှင်များ (variables) သို့မဟုတ် ကိန်းသေများ (constants) အတွင်း ရေးသားမှတ်သားထားနိုင်ပါသည်:

function App() {
	const  elem = <div>text</div>;
	return elem;
}

သင့်ပင်မ component တွင် အောက်ပါ function ပါရှိသည်:

function App() {
	return <div>
		text
	</div>;
}

div tag အတွင်းရှိ စာသားကို ပြောင်းလဲပါ။ Browser ထဲတွင် ဖြစ်ပေါ်လာသည့် အပြောင်းအလဲများကို ကြည့်ရှုပါ။

div tag အတွင်းသို့ စာပိုဒ်အချို့ (paragraphs) ထည့်သွင်းပါ။

�င့်စာပိုဒ်များကို class များ (အတန်းအစားများ) ထည့်သွင်းပါ။