Fable: 引数をJSオブジェクトとしてコンパイルする属性

作成日 2018年10月30日 · 3コメント · ソース: fable-compiler/Fable

React（メモ、フック）に新しく追加されたものは、コミュニティがクラスではなくコンポーネントとしての機能に移行することを示しています。 F＃のクラス構文はこの目的のために少し冗長なので、これは私たちにとって朗報です。ただし、エクスペリエンスを向上させるためにできることはまだあります。

FableConfで、@ vbfoxは、属性が引数をJSオブジェクトとしてコンパイルできるようにすることを提案したため、propsを使用して関数コンポーネントを定義するたびにレコードを宣言する必要はありません。したがって、代わりに：

type MyProps = { key: string; value1: int; value2: float[] }

let MyComponent (props: MyProps) =
    div [] [...]

// Use
ofFunction MyComponent { key = "foo"; value1 = 5; value2 = [] } []

私たちは書くことができます：

let [<MagicAttribute>] MyComponent (key: string) (value1: int) (value2: float[]) () =
    div [] [...]

// Use?
ofFunction2 (MyComponent "foo" 5 []) []

これがどのように呼ばれるかを議論するのを忘れていることに気づきました。上記のサンプルでは、実行を防ぐために最後にユニット引数を追加しましたが、他の方法があるかもしれません。

原則として、F＃の魔法の属性はできるだけ避けたかったのですが、この場合は正当化できます。別の方法として、匿名レコードがF＃に入るまで待つこともできます。彼らはこの状況を解決するかもしれません、そして我々は標準のF＃に合わせるでしょう、そして彼らはF＃プレビューの早い段階にあるようです。

discussion

ソース

alfonsogarciacaro

最も参考になるコメント

匿名のレコードはまだかなり冗長です：

// Declaration
let userView = namedMemo "User" (fun ({| UserId: string; Name: string |}) ->
    a [Href (sprintf "/%s/" props.UserId)] [str props.Name])

// Usage
ofElementType userView { UserId = "vbfox"; Name = "Julien Roncaglia" } []

通常の記録：

// Declaration
type UserViewProps = { UserId: string; Name: string }
let userView = namedMemo "User" (fun props ->
    a [Href (sprintf "/%s/" props.UserId)] [str props.Name])

// Usage
ofElementType userView { UserId = "vbfox"; Name = "Julien Roncaglia" } []

しかし、私の提案について考えれば考えるほど、問題が発生します...このようなプリミティブを使用しても、機能コンポーネントは機能しますが、引数名がコンパイラから失われるため、メモのようなラップされたコンポーネントは機能しません:(：（:(

この@alfonsogarciacaroを閉じることができると思います。これを解決する方法が見つかったら、もう一度開きます...今のところ、レコードまたはタプルXDを作成します。

vbfox 2018年10月30日

👍2 😄1

全てのコメント3件

別の方法として、匿名のレコードがF＃に入るまで待つこともできます。

この問題はすでにF＃の部分で対処されており、レコードを定義することでFableに代替手段がすでに存在するため、匿名のレコードができるまで待つことをお勧めします。それ以外の場合は、実装、テスト、文書化、いくつかの例を追加する必要があることは言うまでもなく、近い将来削除される機能のみを追加し、ユーザーは寓話の癖の武器の隣にさらに別の属性を学ぶ必要がありますjavascriptyのことをする

Zaid-Ajaj 2018年10月30日

👍2

匿名のF＃レコードを待つことに賛成です

MangelMaxime 2018年10月30日