Olá, estou tendo alguns problemas escrevendo ligações para um pequeno componente React. Eu tenho um tipo de união típico com casos que representam adereços para o componente. Um desses casos se parece com Tabs of ITab list
. Quando tento transformar uma lista desses adereços em um objeto com keyValueList
funciona bem, até que eu adicione o prop Tabs
, onde o JavaScript então lançará um erro dizendo Cannot infer key and value of [object Object]
.
open Fable.Core
open Fable.Core.JsInterop
type ITab =
{ Name: string
Selected: bool }
type Props =
| Tabs of ITab list
| Title of string
let tab = { Name = "Hello"; Selected = true }
let works = keyValueList CaseRules.LowerFirst [Title "My Title"]
let doesNotWork = keyValueList CaseRules.None [Tabs [tab]; Title "My Title"]
Eu esperaria que o doesNotWork
não gerasse um erro e gerasse um objeto parecido com:
var doesNotWork = {
title: "My Title",
tabs: [
{
name: "Hello",
selected: true
}
]
}
dotnet fable --version
): 1.3.0Você pode corrigir seu problema usando uma matriz:
open Fable.Core
open Fable.Core.JsInterop
type ITab =
{ Name: string
Selected: bool }
type Props =
| Tabs of ITab array
| Title of string
let tab = { Name = "Hello"; Selected = true }
let works = keyValueList CaseRules.LowerFirst [Title "My Title"]
let doesNotWork = keyValueList CaseRules.None [Tabs [| tab |]; Title "My Title"]
O problema ocorre porque o Json/JObject não usa o tipo de lista que é um objeto em tempo de execução. Json/Jobject só conhece arrays.
Obrigada! Eu não estava ciente dessa limitação, tudo está funcionando agora depois de mudar para o array.
Sim, na verdade, se você usar uma lista keyValueList
interpretará que é uma keyValueList aninhada, como no caso de Style
:
div [ClassName "foo"
Style [BackgroundColor "red"
Width "500px"]] []
Comentários muito úteis
Você pode corrigir seu problema usando uma matriz:
O problema ocorre porque o Json/JObject não usa o tipo de lista que é um objeto em tempo de execução. Json/Jobject só conhece arrays.