Il faudrait ajouter un attribut supplémentaire pour modéliser les composants importés et donc les mêmes transformations dans le site d'appel. Nous pouvons donc utiliser facilement des arguments facultatifs ou des accessoires d'enregistrement (anonymes):
type ExternalModule =
[<ImportedReactComponent("AnotherComponent", from="external-module")>]
static member Component(name: string, flag: bool): ReactElement = jsNative
[<ImportedReactComponent("AnotherComponent", from="external-module")>]
let AnotherComponent (props: {| foo: int; bar: string |}): ReactElement = jsNative
C'est pour ne pas oublier, je vais essayer d'envoyer un PR moi-même.
Oh ce serait vraiment cool
Pourquoi ne pas utiliser le même attribut ?
// import { AnotherComponent } from "external-module";
[<ReactComponent(import="AnotherComponent", from="external-module")>]
let Component(name: string, flag: bool): ReactElement = jsNative
// import Component from "external-module"
[<ReactComponent(importDefaultFrom="external-module")>]
let Component(name: string, flag: bool): ReactElement = jsNative
Personnellement, j'aime mieux ça, qu'en pensez-vous?
ça devrait marcher aussi
Mon futur moi me dit simplement qu'il pourrait y avoir un problème à l'avenir si nous voulons faire fonctionner les plugins dans le REPL, car actuellement j'utilise System.Activator
pour initialiser le plugin et dans Fable cela ne fonctionne qu'avec le primaire constructeur. Mais les arguments facultatifs ne sont pas autorisés pour les constructeurs d'attributs, nous devons donc utiliser plusieurs constructeurs.
Quoi qu'il en soit, il ne sera pas toujours possible d'éviter les attributs avec plusieurs constructeurs (nous les utilisons déjà) et je suis sûr que nous pourrons trouver une solution de contournement le moment venu 😸
Au cas où vous utiliseriez un attribut séparé, je suggérerais d'utiliser un verbe à la place : [<ImportReactComponent>]
.
Cela le maintiendrait cohérent avec les attributs d'interopérabilité JS (comme [<ImportDefault>]
).
@VitalyBrusentsev Je pense que je vais essayer de nouveaux paramètres dans le même [<ReactComponent>]
à essayer au lieu d'un nouvel attribut
@alfonsogarciacaro je l'essaye en ce moment
@alfonsogarciacaro a publié Feliz v1.25 qui devrait vous permettre d'écrire
[<ReactComponent(import="Hello", from="external-module")>]
let HelloWrapper (name: string) (children: ReactElement []) = Html.none
Où le corps du HelloWrapper
renvoie null
car on ne peut pas se débarrasser de la déclaration et sur le site d'appel, la fonction importée est utilisée à la place avec les paramètres appliqués
Commentaire le plus utile
@alfonsogarciacaro a publié Feliz v1.25 qui devrait vous permettre d'écrire
Où le corps du
HelloWrapper
renvoienull
car on ne peut pas se débarrasser de la déclaration et sur le site d'appel, la fonction importée est utilisée à la place avec les paramètres appliqués