reflect

@effektor/reflektieren

☄️ Effektorspeicher anbringen, um Komponenten ohne Haken zu reagieren.

Installieren

npm install @effector/reflect
# or
pnpm add @effector/reflect

Erste Schritte | API -Dokumente

Motivation

Was ist der Sinn des Nachdenkens?

Es ist das API-Design, mit dem Sie das klassische hoc-ähnliche Muster mithilfe des klassischen hohartigen Musters auf effiziente und komponierbare Weise React-Komponenten mit Effektor schreiben können.

 import { reflect , variant } from '@effector/reflect' ;

export function UserForm ( ) {
  return (
    < FormCard >
      < Name />
      < LastName />
      < SubmitButton />
    </ FormCard >
  ) ;
}

const Name = reflect ( {
  view : Input ,
  bind : {
    value : model . $name ,
    onChange : model . nameChanged ,
  } ,
} ) ;

const LastName = reflect ( {
  view : Input ,
  bind : {
    value : model . $lastName ,
    onChange : model . lastNameChanged ,
  } ,
} ) ;

const SubmitButton = reflect ( {
  view : Button ,
  bind : {
    type : 'submit' , // plain values are allowed too!
    disabled : model . $formValid . map ( ( valid ) => ! valid ) ,
    onClick : model . formSubmitted ,
  } ,
} ) ;

Hier haben wir diese Komponente in kleine Teile unterteilt, die auf bequeme Weise mit reflect Operatoren erstellt wurden. Dies ist eine sehr einfache Beschreibung der props -> values Mapping, die leichter zu lesen und zu ändern ist.

Mit @effector/reflect wird unser $formValid Update nur dazu veranlasst, dass der Subjektbutton erneut gerendert wird, und für alle anderen Teile unseres <UserForm /> wird es buchstäblich null reagiert.

Um mehr zu erfahren, lesen Sie bitte den vollständigen Motivationsartikel.

Freigabeprozess

1. Schauen Sie sich die Entwurfsfreigabe an.
2. Alle PRs sollten korrekte Etiketten und nützliche Titel haben. Hier können Sie die verfügbaren Etiketten überprüfen.
3. Aktualisieren Sie die Labels für PRS und Titel und führen Sie die Veröffentlichungsverarbeitungsmaßnahme als nächstes manuell aus, um den Entwurf der Veröffentlichung zu regenerieren.
4. Überprüfen Sie die neue Version und drücken Sie "Veröffentlichen"
5. Falls erforderlich "Erstellen Sie die Diskussion für diese Veröffentlichung"