DevTulz Online

HTML ನಿಂದ JSX ಪರಿವರ್ತಕ


HTML ನಿಂದ JSX ಪರಿವರ್ತನೆ ಎಂದರೇನು?

JSX ಎಂಬುದು React ಕಾಂಪೊನೆಂಟ್‌ಗಳಲ್ಲಿ ಬಳಸಲಾಗುವ HTML-ಸದೃಶ ಸಿಂಟ್ಯಾಕ್ಸ್ ಆಗಿದೆ. ಅದು HTML ನಂತೆ ಕಾಣಿಸಿದರೂ, ಪ್ರಮುಖ ವ್ಯತ್ಯಾಸಗಳಿವೆ: class ಆಗಿ className ಆಗುತ್ತದೆ, for ಆಗಿ htmlFor ಆಗುತ್ತದೆ, ಇನ್‌ಲೈನ್ ಸ್ಟೈಲ್‌ಗಳು ಸ್ಟ್ರಿಂಗ್‌ಗಳ ಬದಲಿಗೆ JavaScript ಆಬ್ಜೆಕ್ಟ್‌ಗಳನ್ನು ಬಳಸುತ್ತವೆ, ಎಲ್ಲಾ ಟ್ಯಾಗ್‌ಗಳು ಸ್ವಯಂ-ಮುಚ್ಚಲ್ಪಡಬೇಕು, ಮತ್ತು ಈವೆಂಟ್ ಹ್ಯಾಂಡ್ಲರ್‌ಗಳು camelCase ಬಳಸುತ್ತವೆ. ಈ ಟೂಲ್ ಎಲ್ಲಾ ಆ ಪರಿವರ್ತನೆಗಳನ್ನು ಸ್ವಯಂಚಾಲಿತವಾಗಿ ನಿರ್ವಹಿಸುತ್ತದೆ ಆದ್ದರಿಂದ ನೀವು HTML ಅನ್ನು ನೇರವಾಗಿ ಅಂಟಿಸಬಹುದು ಮತ್ತು ನಿಮ್ಮ React ಕಾಂಪೊನೆಂಟ್‌ಗಳಲ್ಲಿ ಬಳಸಲು ಸಿದ್ಧವಾದ ಮಾನ್ಯ JSX ಪಡೆಯಬಹುದು.

HTML ನಿಂದ JSX ಪರಿವರ್ತಕವನ್ನು ಹೇಗೆ ಬಳಸುವುದು

  1. ಎಡ ಪ್ಯಾನೆಲ್‌ಗೆ HTML ಮಾರ್ಕ್‌ಅಪ್ ಅಂಟಿಸಿ (ಅಥವಾ ಸ್ಯಾಂಪಲ್ ಲೋಡ್ ಮಾಡಲು 'ಉದಾಹರಣೆ' ಕ್ಲಿಕ್ ಮಾಡಿ).

  2. JSX ಔಟ್‌ಪುಟ್ ಬಲಭಾಗದಲ್ಲಿ ತಕ್ಷಣ ಕಾಣಿಸಿಕೊಳ್ಳುತ್ತದೆ.

  3. ಅಂಟಿಸಲು ಸಿದ್ಧವಾದ ಸಂಪೂರ್ಣ ಕ್ರಿಯಾತ್ಮಕ ಕಾಂಪೊನೆಂಟ್ ಪಡೆಯಲು ಐಚ್ಛಿಕವಾಗಿ 'ಕಾಂಪೊನೆಂಟ್‌ನಲ್ಲಿ ಸುತ್ತಿಕೊಳ್ಳಿ' ಸಕ್ರಿಯಗೊಳಿಸಿ.

  4. 'JSX ನಕಲಿಸಿ' ಬಟನ್ ಬಳಸಿ JSX ನಕಲಿಸಿ.

Keywords: HTML ನಿಂದ JSX, HTML JSX ಪರಿವರ್ತಕ, HTML ಅನ್ನು React ಗೆ ಪರಿವರ್ತಿಸಿ, className ಪರಿವರ್ತಕ, JSX ಆನ್‌ಲೈನ್, React JSX ಪರಿವರ್ತಕ