ಶೆಡ್ಯೂಲರ್ ಮತ್ತು ಡೇಟಾ ಗ್ರಿಡ್ @needless-ui/react ನಲ್ಲಿ React ಕಾಂಪೊನೆಂಟ್ಗಳಾಗಿಯೂ ಇವೆ: Angular ನಲ್ಲಿರುವ ಅದೇ ವೈಶಿಷ್ಟ್ಯಗಳು, ಕೀಬೋರ್ಡ್ ಮತ್ತು ಆಕ್ಸೆಸಿಬಿಲಿಟಿ, ಅದೇ ಸ್ಟೈಲ್ಶೀಟ್ ಮತ್ತು ಅದೇ MIT ಪರವಾನಗಿ. ಉಳಿದ ಕಾಂಪೊನೆಂಟ್ಗಳು ಬರಲಿವೆ. ಇವುಗಳಿಗೆ React 19 ಬೇಕು, ಮತ್ತು ಇವು Next.js App Router ಹಾಗೂ Vite ಜೊತೆ ಕೆಲಸ ಮಾಡುತ್ತವೆ.
ಇನ್ಸ್ಟಾಲೇಶನ್
pnpm add @needless-ui/react @needless-ui/cssಸ್ಟೈಲ್ಗಳನ್ನು ಇಂಪೋರ್ಟ್ ಮಾಡಿ
ಕಾಂಪೊನೆಂಟ್ಗಳೊಂದಿಗೆ ಸ್ಟೈಲ್ಗಳು ಬರುವುದಿಲ್ಲ. ನಿಮ್ಮ ಆ್ಯಪ್ನ ಒಂದು CSS ಫೈಲ್ನಿಂದ ಸ್ಟೈಲ್ಶೀಟ್ ಅನ್ನು ಒಮ್ಮೆ ಇಂಪೋರ್ಟ್ ಮಾಡಿ.
/* app/globals.css in Next.js, src/index.css with Vite */
@layer reset, nui, app;
@import '@needless-ui/css';ಲೇಯರ್ಗಳು Angular ನಲ್ಲಿರುವಂತೆಯೇ ಕೆಲಸ ಮಾಡುತ್ತವೆ: ರೀಸೆಟ್ಗಳು nui ಗಿಂತ ಮೊದಲಿನ ಲೇಯರ್ನಲ್ಲಿರುತ್ತವೆ, ಮತ್ತು Tailwind CSS ಇದ್ದರೆ nui ಲೇಯರ್ Tailwind ನ base ಮತ್ತು ಅದರ ಯುಟಿಲಿಟಿಗಳ ನಡುವೆ ಬರುತ್ತದೆ. ಪ್ರಾರಂಭಿಸುವುದು ಮಾರ್ಗದರ್ಶಿ ಇದನ್ನು ತೋರಿಸುತ್ತದೆ.
ಒಂದು ಶೆಡ್ಯೂಲರ್
ಪ್ರತಿ ಕಾಂಪೊನೆಂಟ್ಗೂ ತನ್ನದೇ ಎಂಟ್ರಿ ಪಾಯಿಂಟ್ ಇದೆ. ನೀವು ನೀಡುವ events ಅನ್ನು ಶೆಡ್ಯೂಲರ್ ತೋರಿಸುತ್ತದೆ, ಮತ್ತು ಬಳಕೆದಾರರು ಒಂದನ್ನು ಸರಿಸಿದಾಗ ಅಥವಾ ಹೊಸದಕ್ಕೆ ಸಮಯ ಆರಿಸಿದಾಗ ನಿಮಗೆ ತಿಳಿಸುತ್ತದೆ: ಈವೆಂಟ್ಗಳನ್ನು ಇಟ್ಟುಕೊಳ್ಳುವುದು ನೀವೇ.
ಒಂದು ಡೇಟಾ ಗ್ರಿಡ್
columns ಅನ್ನು ಕಾಂಪೊನೆಂಟ್ನ ಹೊರಗೆ ವಿವರಿಸಿ, ಆಗ ಪ್ರತಿ ರೆಂಡರ್ನಲ್ಲೂ ಗ್ರಿಡ್ ತನ್ನ ಕೆಲಸವನ್ನು ಮತ್ತೆ ಮಾಡುವುದಿಲ್ಲ. ಎಡಿಟ್ ಆದಾಗ ಹೊಸ ಸಾಲುಗಳೊಂದಿಗೆ onRowsChange ಅನ್ನು ಕರೆಯಲಾಗುತ್ತದೆ, ಮತ್ತು Excel ಎಕ್ಸ್ಪೋರ್ಟ್ನಂತಹ ಮೆಥಡ್ಗಳು ಗ್ರಿಡ್ನ ref ನಲ್ಲಿವೆ.
React ನ ಪರಿಭಾಷೆಯಲ್ಲಿ API
React ಕಾಂಪೊನೆಂಟ್ಗಳು Angular ಕಾಂಪೊನೆಂಟ್ಗಳ ಅದೇ ಸ್ಪೆಕ್ಗಳನ್ನು ಅನುಸರಿಸುತ್ತವೆ, ಹಾಗಾಗಿ ಅವುಗಳ API ಗಳು React ನ ಪರಿಭಾಷೆಯಲ್ಲಿ ಹೊಂದಿಕೆಯಾಗುತ್ತವೆ. ಶೆಡ್ಯೂಲರ್ನ ಮತ್ತು ಡೇಟಾ ಗ್ರಿಡ್ನ API ಪುಟಗಳು ಪ್ರತಿಯೊಂದು ಪ್ರಾಪ್ ಅನ್ನು ಪಟ್ಟಿ ಮಾಡುತ್ತವೆ.
| Angular | React |
|---|---|
ಒಂದು ಮಾಡೆಲ್, [(view)] | ಸ್ಥಿತಿ: onViewChange ಜೊತೆ view, ಅಥವಾ ಕಾಂಪೊನೆಂಟ್ ತಾನೇ ಇಟ್ಟುಕೊಳ್ಳಲು defaultView |
ಒಂದು ಔಟ್ಪುಟ್, (eventClick) | ಒಂದು ಕಾಲ್ಬ್ಯಾಕ್, onEventClick |
ಒಂದು ಟೆಂಪ್ಲೇಟ್, <ng-template nuiSchedulerEvent> | ಬಿಡಿಸುವ ಫಂಕ್ಷನ್, renderEvent |
ಒಂದು ಮೆಥಡ್, scheduler.next() | ref ನಲ್ಲಿರುವ ಮೆಥಡ್, ref.current.next() |
children, ಟ್ರೀ ಡೇಟಾಗಾಗಿ | getChildren: React children ಅನ್ನು ಎಲಿಮೆಂಟ್ಗಳಿಗಾಗಿ ಇಟ್ಟುಕೊಳ್ಳುತ್ತದೆ |
locale, ಡೀಫಾಲ್ಟ್ ಆಗಿ ಆ್ಯಪ್ನ LOCALE_ID | locale, ಡೀಫಾಲ್ಟ್ ಆಗಿ en-US |
ಸರ್ವರ್ ರೆಂಡರಿಂಗ್
ಎರಡೂ ಕಾಂಪೊನೆಂಟ್ಗಳು ಸರ್ವರ್ನಲ್ಲಿ ರೆಂಡರ್ ಆಗಿ ಬ್ರೌಸರ್ನಲ್ಲಿ ಹೈಡ್ರೇಟ್ ಆಗುತ್ತವೆ. ಪ್ಯಾಕೇಜ್ ಅವುಗಳನ್ನು ಕ್ಲೈಂಟ್ ಕಾಂಪೊನೆಂಟ್ಗಳೆಂದು ಗುರುತಿಸುತ್ತದೆ, ಹಾಗಾಗಿ Server Component ಸೀರಿಯಲೈಸ್ ಆಗುವ ಪ್ರಾಪ್ಗಳೊಂದಿಗೆ ಅವುಗಳನ್ನು ರೆಂಡರ್ ಮಾಡಬಹುದು, ಮತ್ತು nuiSchedulerFromIcs ನಂತಹ ಸಹಾಯಕ ಫಂಕ್ಷನ್ಗಳು ಸರ್ವರ್ನಲ್ಲೇ ರನ್ ಆಗುತ್ತವೆ. ಕಾಲ್ಬ್ಯಾಕ್ಗಳು ಬ್ರೌಸರ್ಗೆ ದಾಟಲಾರವು: ಅವನ್ನು ಪಡೆಯುವ ಕಾಂಪೊನೆಂಟ್, ಮೇಲಿನ ಎರಡರಂತೆ, ನಿಮ್ಮದೇ ಕ್ಲೈಂಟ್ ಕಾಂಪೊನೆಂಟ್ನಲ್ಲಿ ಇರಬೇಕು.
ಓದುಗರನ್ನು ಅವಲಂಬಿಸಿದ್ದು ಬ್ರೌಸರ್ಗಾಗಿ ಕಾಯುತ್ತದೆ: ಶೆಡ್ಯೂಲರ್ನಲ್ಲಿ ಈಗಿನ ಸಮಯದ ಗೆರೆ, ಮತ್ತು ಇಂದು ಯಾವ ದಿನ ಎಂಬುದು. ಸರ್ವರ್ ಶೆಡ್ಯೂಲರ್ ಅನ್ನು ರೆಂಡರ್ ಮಾಡುವಾಗ ಅದಕ್ಕೆ defaultDate ನೀಡಿ, ಏಕೆಂದರೆ ಸರ್ವರ್ನ ಇಂದಿನ ದಿನಾಂಕ ಓದುಗರದ್ದೇ ಆಗಿರಬೇಕಿಲ್ಲ.