logologo
Mulai
Panduan
Pengembangan
Plugin
API
English
简体中文
日本語
한국어
Deutsch
Français
Español
Português
Русский
Italiano
Türkçe
Українська
Tiếng Việt
Bahasa Indonesia
ไทย
Polski
Nederlands
Čeština
العربية
עברית
हिन्दी
Svenska
Mulai
Panduan
Pengembangan
Plugin
API
logologo

Pengantar

Apa itu FlowEngine?
Hubungan FlowEngine & Plugin
Mulai Cepat
Peta Jalan Belajar

Panduan

Registrasi FlowModel
Buat FlowModel
Render FlowModel
Alur Event & Konfigurasi FlowModel
Persistensi FlowModel
Siklus Hidup FlowModel
Sistem Konteks FlowModel
Mekanisme Responsif: Observable
FlowModel vs React.Component

Definitions

ModelDefinition
FlowDefinition
EventDefinition
ActionDefinition
StepDefinition
Previous PageMekanisme Responsif: Observable
Next PageModelDefinition
TIP

Dokumen ini diterjemahkan oleh AI. Untuk ketidakakuratan apa pun, silakan lihat versi bahasa Inggris

#FlowModel vs React.Component

#Perbandingan Tanggung Jawab Dasar

Fitur/KemampuanReact.ComponentFlowModel
Kemampuan RenderYa, metode render() menghasilkan UIYa, metode render() menghasilkan UI
Manajemen Statestate dan setState bawaanMenggunakan props, tetapi manajemen state lebih bergantung pada struktur pohon model
Siklus HidupYa, contohnya componentDidMountYa, contohnya onInit, onMount, onUnmount
TujuanMembangun komponen UIMembangun "pohon model" yang digerakkan oleh data, berbasis alur, dan terstruktur
Struktur DataPohon komponenPohon model (mendukung model induk-anak, Fork multi-instans)
Komponen AnakMenggunakan JSX untuk menyarangkan komponenMenggunakan setSubModel/addSubModel untuk secara eksplisit mengatur sub-model
Perilaku DinamisPengikatan event, pembaruan state menggerakkan UIMendaftarkan/mengirim Alur, menangani alur otomatis
PersistensiTidak ada mekanisme bawaanMendukung persistensi (misalnya model.save())
Mendukung Fork (render berkali-kali)Tidak (memerlukan penggunaan ulang manual)Ya (createFork untuk multi-instansiasi)
Kontrol MesinTidak adaYa, dikelola, didaftarkan, dan dimuat oleh FlowEngine

#Perbandingan Siklus Hidup

Hook Siklus HidupReact.ComponentFlowModel
Inisialisasiconstructor, componentDidMountonInit, onMount
PembongkarancomponentWillUnmountonUnmount
Menanggapi InputcomponentDidUpdateonBeforeAutoFlows, onAfterAutoFlows
Penanganan ErrorcomponentDidCatchonAutoFlowsError

#Perbandingan Struktur Konstruksi

React:

class MyComponent extends React.Component {
  render() {
    return <div>Hello</div>;
  }
}

FlowModel:

class HelloModel extends FlowModel {
  render() {
    return <div>Hello</div>;
  }
}

#Pohon Komponen vs Pohon Model

  • Pohon Komponen React: Pohon render UI yang dibentuk oleh penyarangan JSX saat runtime.
  • Pohon Model FlowModel: Pohon struktur logis yang dikelola oleh FlowEngine, yang dapat dipertahankan, serta memungkinkan pendaftaran dan kontrol sub-model secara dinamis. Cocok untuk membangun blok halaman, alur tindakan, model data, dll.

#Fitur Khusus (Spesifik FlowModel)

FungsiDeskripsi
registerFlowMendaftarkan alur
applyFlow / dispatchEventMenjalankan/memicu alur
setSubModel / addSubModelSecara eksplisit mengontrol pembuatan dan pengikatan sub-model
createForkMendukung penggunaan ulang logika model untuk beberapa render (misalnya, setiap baris dalam tabel)
openFlowSettingsPengaturan langkah alur
save / saveStepParams()Model dapat dipertahankan dan diintegrasikan dengan backend

#Ringkasan

ItemReact.ComponentFlowModel
Skenario yang CocokOrganisasi komponen lapisan UIManajemen alur dan blok yang digerakkan oleh data
Ide IntiUI DeklaratifAlur terstruktur berbasis model
Metode ManajemenReact mengontrol siklus hidupFlowModel mengontrol siklus hidup dan struktur model
KeunggulanEkosistem dan toolchain yang kayaSangat terstruktur, alur dapat dipertahankan, sub-model dapat dikontrol

FlowModel dapat digunakan secara komplementer dengan React: Menggunakan React untuk rendering di dalam FlowModel, sementara siklus hidup dan strukturnya dikelola oleh FlowEngine.