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

Introductie

Wat is FlowEngine?
Relatie tussen FlowEngine en plug-ins
Snelstart
Leertraject

Gids

FlowModel registreren
FlowModel aanmaken
FlowModel renderen
FlowModel event-flow en configuratie
FlowModel persistentie
FlowModel levenscyclus
FlowModel context-systeem
Reactief mechanisme: Observable
FlowModel vs React.Component

Definities

ModelDefinition
FlowDefinition
EventDefinition
ActionDefinition
StepDefinition
Previous PageReactief mechanisme: Observable
Next PageModelDefinition
TIP

Dit document is vertaald door AI. Voor onnauwkeurigheden, raadpleeg de Engelse versie

#FlowModel vs React.Component

#Vergelijking van basisverantwoordelijkheden

Functie/MogelijkheidReact.ComponentFlowModel
WeergavemogelijkheidJa, de render() methode genereert UIJa, de render() methode genereert UI
StatusbeheerIngebouwde state en setStateGebruikt props, maar statusbeheer is meer afhankelijk van de modelboomstructuur
LevenscyclusJa, bijv. componentDidMountJa, bijv. onInit, onMount, onUnmount
DoelBouwen van UI-componentenBouwen van datagedreven, flow-gebaseerde, gestructureerde "modelbomen"
DatastructuurComponentboomModelboom (ondersteunt ouder-kindmodellen, multi-instantie Fork)
KindcomponentenGebruikt JSX om componenten te nestenGebruikt setSubModel/addSubModel om submodellen expliciet in te stellen
Dynamisch gedragGebeurtenisbinding, statusupdates sturen UI aanRegistreren/dispatchen van flows, afhandelen van automatische flows
PersistentieGeen ingebouwd mechanismeOndersteunt persistentie (bijv. model.save())
Ondersteunt Fork (meerdere weergaven)Nee (vereist handmatig hergebruik)Ja (createFork voor meerdere instantiaties)
Engine-besturingGeenJa, beheerd, geregistreerd en geladen door FlowEngine

#Levenscyclusvergelijking

Levenscyclus-hookReact.ComponentFlowModel
Initialisatieconstructor, componentDidMountonInit, onMount
OntkoppelencomponentWillUnmountonUnmount
Reageren op invoercomponentDidUpdateonBeforeAutoFlows, onAfterAutoFlows
FoutafhandelingcomponentDidCatchonAutoFlowsError

#Vergelijking van opbouwstructuur

React:

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

FlowModel:

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

#Componentboom vs Modelboom

  • React Componentboom: Een UI-weergaveboom die tijdens runtime wordt gevormd door geneste JSX.
  • FlowModel Modelboom: Een logische structuurboom die wordt beheerd door FlowEngine, die persistent kan worden gemaakt en dynamische registratie en besturing van submodellen mogelijk maakt. Geschikt voor het bouwen van paginablokken, actie-flows, datamodellen, enz.

#Speciale functies (specifiek voor FlowModel)

FunctieBeschrijving
registerFlowRegistreer flow
applyFlow / dispatchEventVoer flow uit / activeer flow
setSubModel / addSubModelExpliciet de aanmaak en koppeling van submodellen beheren
createForkOndersteunt het hergebruiken van de logica van een model voor meerdere weergaven (bijv. elke rij in een tabel)
openFlowSettingsFlow-stapinstellingen
save / saveStepParams()Het model kan persistent worden gemaakt en geïntegreerd met de backend

#Samenvatting

OnderdeelReact.ComponentFlowModel
Geschikte scenario'sOrganisatie van UI-laagcomponentenDatagedreven flow- en blokbeheer
KernideeDeclaratieve UIModelgedreven gestructureerde flow
BeheermethodeReact beheert de levenscyclusFlowModel beheert de levenscyclus en structuur van het model
VoordelenRijk ecosysteem en toolchainSterk gestructureerd, flows kunnen persistent worden gemaakt, submodellen zijn controleerbaar

FlowModel kan complementair met React worden gebruikt: u gebruikt React voor de rendering binnen een FlowModel, terwijl de levenscyclus en structuur ervan worden beheerd door FlowEngine.