38a6b424e879567048df27e4b39fec35a9fb148f
1. Pembuatan dan Pembaruan Komponen Layar Investasi dengan Sistem Pagination
ScreenMyHolding.tsx
- Diperbarui dari sistem loading data statis ke sistem pagination dinamis
- Menggunakan hook usePagination untuk manajemen data
- Mengganti ViewWrapper dengan NewWrapper untuk tampilan yang lebih modern
- Menambahkan fitur pull-to-refresh dan infinite scroll
- Menggunakan helper pagination dari createPaginationComponents
ScreenInvestor.tsx
- Dibuat baru dengan sistem pagination
- Menggunakan hook usePagination untuk manajemen data
- Menggunakan NewWrapper sebagai komponen dasar
- Menambahkan fitur pull-to-refresh dan infinite scroll
ScreenRecapOfNews.tsx
- Dibuat baru dengan sistem pagination
- Menggunakan hook usePagination untuk manajemen data
- Menggunakan NewWrapper sebagai komponen dasar
- Menambahkan fitur pull-to-refresh dan infinite scroll
ScreenListOfNews.tsx
- Dibuat baru dengan sistem pagination
- Menggunakan hook usePagination untuk manajemen data
- Menggunakan NewWrapper sebagai komponen dasar
- Menambahkan fitur pull-to-refresh dan infinite scroll
2. Perubahan pada Fungsi-Fungsi API untuk Mendukung Pagination
apiInvestmentGetAll
- Sudah mendukung parameter page dengan default "1"
apiInvestmentGetInvestorById
- Ditambahkan parameter page dengan default "1"
- Memungkinkan pengambilan data investor secara bertahap
apiInvestmentGetNews
- Ditambahkan parameter page dengan default "1"
- Memungkinkan pengambilan data berita secara bertahap
3. Pembaruan File-File di Direktori app/ untuk Menggunakan Komponen-Komponen Baru
app/(application)/(user)/investment/[id]/investor.tsx
- Diperbarui untuk menggunakan komponen Investment_ScreenInvestor
- Menghilangkan logika lokal dan menggantinya dengan komponen modular
app/(application)/(user)/investment/[id]/(news)/recap-of-news.tsx
- Diperbarui untuk menggunakan komponen Investment_ScreenRecapOfNews
- Menghilangkan logika lokal dan menggantinya dengan komponen modular
app/(application)/(user)/investment/[id]/(news)/list-of-news.tsx
- Diperbarui untuk menggunakan komponen Investment_ScreenListOfNews
- Menghilangkan logika lokal dan menggantinya dengan komponen modular
4. Implementasi Sistem Pagination
usePagination Hook
- Digunakan secara konsisten di semua komponen layar investasi
- Menyediakan fitur load more dan refresh
- Mengelola state loading, refreshing, dan data
NewWrapper Component
- Digunakan sebagai pengganti ViewWrapper
- Menyediakan dukungan bawaan untuk FlatList
- Menyediakan dukungan untuk refreshControl dan onEndReached
Pagination Helpers
- Menggunakan createPaginationComponents untuk menghasilkan komponen-komponen pagination
- Menyediakan skeleton loading saat data sedang dimuat
- Menyediakan pesan kosong saat tidak ada data
5. Manfaat dari Perubahan Ini
1. Performa Lebih Baik: Dengan pagination, hanya sejumlah kecil data yang dimuat pada satu waktu, meningkatkan
performa aplikasi
2. Pengalaman Pengguna Lebih Baik: Fitur pull-to-refresh dan infinite scroll membuat navigasi lebih intuitif
3. Kode Lebih Modular: Komponen-komponen baru dapat digunakan kembali dan dipelihara lebih mudah
4. Struktur Kode Lebih Rapi: Pemisahan antara logika tampilan dan logika data membuat kode lebih terorganisir
Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>
Welcome to your Expo app 👋
This is an Expo project created with create-expo-app.
Get started
-
Install dependencies
npm install -
Start the app
npx expo start
In the output, you'll find options to open the app in a
- development build
- Android emulator
- iOS simulator
- Expo Go, a limited sandbox for trying out app development with Expo
You can start developing by editing the files inside the app directory. This project uses file-based routing.
Get a fresh project
When you're ready, run:
npm run reset-project
This command will move the starter code to the app-example directory and create a blank app directory where you can start developing.
Learn more
To learn more about developing your project with Expo, look at the following resources:
- Expo documentation: Learn fundamentals, or go into advanced topics with our guides.
- Learn Expo tutorial: Follow a step-by-step tutorial where you'll create a project that runs on Android, iOS, and the web.
Join the community
Join our community of developers creating universal apps.
- Expo on GitHub: View our open source platform and contribute.
- Discord community: Chat with Expo users and ask questions.
hipmi-mobile
Description
Languages
TypeScript
98.9%
Kotlin
0.3%
Ruby
0.3%
JavaScript
0.3%
Swift
0.2%