Saya akan bermigrasi ke Redux.
Aplikasi saya terdiri dari banyak bagian (halaman, komponen) jadi saya ingin membuat banyak reduksi. Contoh redux menunjukkan bahwa saya harus menggunakan combineReducers()
untuk menghasilkan satu peredam.
Juga saya mengerti aplikasi Redux harus memiliki satu toko dan dibuat setelah aplikasi dimulai. Ketika toko sedang dibuat saya harus melewati peredam gabungan saya. Ini masuk akal jika aplikasinya tidak terlalu besar.
Tetapi bagaimana jika saya membangun lebih dari satu bundel JavaScript? Misalnya, setiap halaman aplikasi memiliki bundel sendiri. Saya pikir dalam hal ini peredam kombinasi tidak bagus. Saya melihat melalui sumber-sumber Redux dan saya telah menemukan replaceReducer()
fungsinya. Sepertinya itulah yang saya inginkan.
Saya dapat membuat reducer gabungan untuk setiap bagian aplikasi saya dan digunakan replaceReducer()
ketika saya berpindah di antara bagian aplikasi.
Apakah ini pendekatan yang baik?
sumber
/homepage
dan kemudian lebih banyak cabang yang dimuat ketika pengguna pergi ke merekaprofile.
. Contoh bagaimana untuk melakukan ini, akan luar biasa. Kalau tidak, saya akan kesulitan meratakan pohon negara saya atau saya harus memiliki nama cabang yang sangat spesifikuser-permissions
danuser-personal
Ini adalah bagaimana saya mengimplementasikannya di aplikasi saat ini (berdasarkan kode oleh Dan dari masalah GitHub!)
Buat instance registri saat mem-bootstrap aplikasi Anda, dengan memasukkan reduksi yang akan disertakan dalam bundel entri:
Kemudian ketika mengonfigurasi toko dan rute, gunakan fungsi yang Anda bisa memberikan registri peredam ke:
Di mana fungsi-fungsi ini terlihat seperti:
Berikut adalah contoh langsung dasar yang dibuat dengan pengaturan ini, dan sumbernya:
Ini juga mencakup konfigurasi yang diperlukan untuk mengaktifkan pemuatan ulang panas untuk semua reduksi Anda.
sumber
Sekarang ada modul yang menambahkan injeksi reduksi ke toko redux. Itu disebut Redux Injector .
Berikut cara menggunakannya:
Jangan gabungkan reduksi. Alih-alih menempatkan mereka dalam objek fungsi (bersarang) seperti biasa tetapi tanpa menggabungkannya.
Gunakan createInjectStore dari redux-injector daripada createStore dari redux.
Suntikkan reduksi baru dengan injectReducer.
Berikut ini sebuah contoh:
Pengungkapan Penuh: Saya adalah pencipta modul.
sumber
Per Oktober 2017:
Reedux
mengimplementasikan apa yang disarankan Dan dan tidak lebih, tanpa menyentuh toko Anda, proyek Anda atau kebiasaan Anda
Ada perpustakaan lain juga, tetapi mereka mungkin memiliki terlalu banyak dependensi, contoh kurang, penggunaan rumit, tidak kompatibel dengan beberapa middlewares atau mengharuskan Anda untuk menulis ulang manajemen negara Anda. Disalin dari halaman intro Reedux:
sumber
Kami merilis perpustakaan baru yang membantu memodulasi aplikasi Redux dan memungkinkan menambah / menghapus Reducers dan middlewares secara dinamis.
Silakan lihat di https://github.com/Microsoft/redux-dynamic-modules
Modul memberikan manfaat berikut:
Modul dapat dengan mudah digunakan kembali di seluruh aplikasi, atau di antara beberapa aplikasi serupa.
Komponen mendeklarasikan modul yang dibutuhkan oleh mereka dan modul redux-dynamic-memastikan bahwa modul dimuat untuk komponen.
fitur
Contoh Skenario
sumber
Berikut adalah contoh lain dengan toko pemecahan kode dan redux, cukup sederhana & elegan menurut saya. Saya pikir ini mungkin sangat berguna bagi mereka yang mencari solusi yang berfungsi.
Ini toko ini sedikit disederhanakan ia tidak memaksa Anda untuk memiliki namespace (reducer.name) di objek negara Anda, tentu saja mungkin ada tabrakan dengan nama tetapi Anda dapat mengontrol ini dengan menciptakan konvensi penamaan untuk pengecil Anda dan itu harus baik-baik saja.
sumber