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 이

vbfox 에 2018년 10월 30일

👍2 😄1

모든 3 댓글

대안은 익명 레코드가 F#에 들어올 때까지 기다리는 것입니다.

이 문제는 이미 F# 부분에서 해결되었으며 Fable에 레코드를 정의하는 대안이 이미 있으므로 익명의 레코드가 생길 때까지 기다리는 것이 좋습니다. 그렇지 않으면 가까운 시일 내에 제거될 기능만 추가하게 됩니다. 구현, 테스트, 문서화, 몇 가지 예와 함께 추가해야 하는 것은 말할 것도 없고 사용자는 Fable 특유의 무기고 옆에 또 다른 속성을 배워야 합니다. 자바 스크립트 일을

Zaid-Ajaj 에 2018년 10월 30일

👍2

익명의 F# 레코드를 기다리는 것에 찬성합니다.

MangelMaxime 에 2018년 10월 30일