Rendere einer Komponente innerhalb eines Widgets (Verwendung von select-kit-Komponenten in Plugin-Code)

[merefield (Robert)]

@david

Damit der Status funktioniert, müssen Sie eine buildKey und eine defaultState()-Methode definieren.

Ja, die habe ich definiert. Ich werde es aufräumen und in ein Repository pushen.

Ein Test, der eine Form der Zwei-Wege-Bindung mit einer eingebetteten Komponente demonstriert, wäre äußerst hilfreich!

[david (David Taylor)]

@merefield

this.state ist in der Änderungsfunktion undefiniert, was die Sache etwas knifflig macht?

Ich konnte darauf und auf die Funktion scheduleRerender() zugreifen. Tests und Dokumentation aktualisiert in

DEV: Improve testing and documentation of RenderGlimmer actions

Nur zur Bestätigung – wird Ihr @bind von discourse-common/utils/decorators importiert?

[merefield (Robert)]

@david

Ist Ihr @bind aus discourse-common/utils/decorators importiert?

Bestätigt

Hier ist das Repository: GitHub - merefield/discourse-tc-bars-tag-intersection-chooser: A small widget to allow you to navigate to a topic list based on a combinations of tags

Und die Widget-Datei speziell: layouts-tag-intersection-widget/layouts-tag-combo.js.es6 at master · paviliondev/layouts-tag-intersection-widget (github.com)

Sehr WIP und wie angegeben nicht funktionierend.

(Erfordert, dass das Layouts-Plugin installiert und konfiguriert ist, um es wie derzeit zu testen, aber es ist trivial, den Widget-Code zu extrahieren)

[david (David Taylor)]

Ah, ich glaube, das könnte helfen:

- @onChange={{action @data.onChangeUpdateTagSet}}/>
+ @onChange=@data.onChangeUpdateTagSet/>

Wenn eine „Closure Action“ übergeben wird, ist die (action-Hilfsfunktion nicht erforderlich (und in diesem Fall scheint sie die Dinge tatsächlich zu beeinträchtigen).

[merefield (Robert)]

Das scheint zu TypeError: this.attrs.onChange ist keine Funktion zu führen?

Aber ja, vielleicht überschreibt dieser Helfer die verfügbaren Attribute?

[david (David Taylor)]

Oh, mein Fehler, wir brauchen dort geschweifte Klammern, sonst wird es nur als Zeichenfolgenattribut interpretiert.

- @onChange={{action @data.onChangeUpdateTagSet}}/\u003e
+ @onChange={{@data.onChangeUpdateTagSet}} /\u003e

[merefield (Robert)]

Leider führt das zu demselben Fehler?

[david (David Taylor)]

Können Sie einen Haltepunkt hinzufügen und herausfinden, welchen Wert this.attrs.onChange hat? (Die Funktion „Anhalten bei Ausnahme“ in den Entwicklertools kann hier hilfreich sein)

[merefield (Robert)]

@David und ich haben dies per PM gelöst:

@david

Es stellt sich heraus, dass @bind in Widgets nur für Widgets funktioniert, die mit der Klassensyntax definiert wurden. Deshalb funktioniert es im Test - ich habe class Blah extends Widget { ... } verwendet.

Für nicht klassenbasierte Widgets müssen Sie die Funktion manuell binden, wie z. B.

hbs`
<UserMenu::Menu @closeUserMenu={{@data.closeUserMenu}} />`,
{
  closeUserMenu: this.closeUserMenu.bind(this),
}

Vielen Dank für deine Zeit, @David.

Ich werde den TC veröffentlichen, sobald er abgeschlossen ist.

[merefield (Robert)]

Dies ist jetzt eine Sache, wenn auch im Moment noch etwas grob fertiggestellt:

Erfordert das Layouts Plugin.

Repo der Theme-Komponente hier: GitHub - merefield/discourse-tc-bars-tag-intersection-chooser: A small widget to allow you to navigate to a topic list based on a combinations of tags

[merefield (Robert)]

FYI, diese Komponente unterstützt jetzt auch rechte Seitenleistenblöcke!

[merefield (Robert)]

FYI Diese Komponente unterstützt Discourse Bars 🍻 🍸 (a sidebar framework)