logologo
Start
Dokumentacja
Deweloperzy
Wtyczki
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
Dokumentacja
Deweloperzy
Wtyczki
API
logologo

Wprowadzenie

Czym jest FlowEngine?
FlowEngine a wtyczki
Szybki start
Ścieżka nauki

Przewodnik

Rejestracja FlowModel
Tworzenie FlowModel
Renderowanie FlowModel
Strumień zdarzeń i konfiguracja FlowModel
Utrwalanie FlowModel
Cykl życia FlowModel
System kontekstu FlowModel
Mechanizm reaktywny: Observable
FlowModel vs React.Component

Definicje

ModelDefinition
FlowDefinition
EventDefinition
ActionDefinition
StepDefinition
Previous PageMechanizm reaktywny: Observable
Next PageModelDefinition
TIP

Ten dokument został przetłumaczony przez AI. W przypadku niedokładności, proszę odnieść się do wersji angielskiej

#FlowModel a React.Component

#Porównanie podstawowych zadań

Cecha/MożliwośćReact.ComponentFlowModel
Zdolność renderowaniaTak, metoda render() generuje UITak, metoda render() generuje UI
Zarządzanie stanemWbudowane state i setStateWykorzystuje props, ale zarządzanie stanem w większym stopniu opiera się na strukturze drzewa modeli
Cykl życiaTak, np. componentDidMountTak, np. onInit, onMount, onUnmount
PrzeznaczenieBudowanie komponentów UIBudowanie zorientowanych na dane, opartych na przepływach pracy, ustrukturyzowanych „drzew modeli”
Struktura danychDrzewo komponentówDrzewo modeli (obsługuje modele rodzic-dziecko, Fork dla wielu instancji)
Elementy potomneUżycie JSX do zagnieżdżania komponentówUżycie setSubModel/addSubModel do jawnego ustawiania modeli potomnych
Dynamiczne zachowanieWiązanie zdarzeń, aktualizacje stanu napędzają UIRejestrowanie/wysyłanie przepływów pracy, obsługa automatycznych przepływów
TrwałośćBrak wbudowanego mechanizmuObsługuje trwałość (np. model.save())
Obsługa Fork (wielokrotne renderowanie)Nie (wymaga ręcznego ponownego użycia)Tak (createFork dla wielu instancji)
Kontrola silnikaBrakTak, zarządzany, rejestrowany i ładowany przez FlowEngine

#Porównanie cykli życia

Hak cyklu życiaReact.ComponentFlowModel
Inicjalizacjaconstructor, componentDidMountonInit, onMount
OdmontowaniecomponentWillUnmountonUnmount
Reagowanie na dane wejściowecomponentDidUpdateonBeforeAutoFlows, onAfterAutoFlows
Obsługa błędówcomponentDidCatchonAutoFlowsError

#Porównanie struktur budowy

React:

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

FlowModel:

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

#Drzewo komponentów a drzewo modeli

  • Drzewo komponentów React: Drzewo renderowania interfejsu użytkownika, tworzone przez zagnieżdżony JSX w czasie wykonania.
  • Drzewo modeli FlowModel: Drzewo struktury logicznej zarządzane przez FlowEngine, które może być utrwalane i umożliwia dynamiczną rejestrację oraz kontrolę modeli potomnych. Nadaje się do budowania bloków stron, przepływów akcji, modeli danych itp.

#Funkcje specjalne (specyficzne dla FlowModel)

FunkcjaOpis
registerFlowRejestracja przepływu pracy
applyFlow / dispatchEventWykonanie/wyzwolenie przepływu pracy
setSubModel / addSubModelJawna kontrola tworzenia i wiązania modeli potomnych
createForkObsługuje ponowne wykorzystanie logiki modelu do wielokrotnego renderowania (np. dla każdego wiersza w tabeli)
openFlowSettingsUstawienia kroku przepływu pracy
save / saveStepParams()Model może być utrwalany i integrowany z zapleczem

#Podsumowanie

ElementReact.ComponentFlowModel
Odpowiednie scenariuszeOrganizacja komponentów warstwy UIZarządzanie przepływami pracy i blokami opartymi na danych
Główna ideaDeklaratywny interfejs użytkownikaUstrukturyzowany przepływ pracy oparty na modelach
Metoda zarządzaniaReact kontroluje cykl życiaFlowModel kontroluje cykl życia i strukturę modelu
ZaletyBogaty ekosystem i zestaw narzędziSilna strukturyzacja, przepływy pracy mogą być utrwalane, modele potomne są kontrolowalne

FlowModel może być używany komplementarnie z React: React jest wykorzystywany do renderowania w ramach FlowModel, podczas gdy jego cykl życia i struktura są zarządzane przez FlowEngine.