React-Admin: 我如何处理对象列表上的输入源？

Question

在 react-admin我有一个 input 其来源是一个对象列表。

<CheckboxGroupInput  source="binded_cameras" choices={choices}/>

该 binded_cameras 列表是这样的。

"binded_cameras": [
    {
       "id": 1,
       "name": "Cam 1",
       "url": "dummyurl.com"
    },
    {
       "id": 4,
       "name": "Cam 2",
       "url": "dummyurl.com"
     }
]

我只想得到 id 来处理。我试过 binded_cameras.id 但当然没有成功。我如何操作这个对象列表，并且只生成一个id列表？

Answer 1

由于React-admin使用的是react-final-form，你可以使用parse()和format()函数在保存和加载记录时转换输入值，只需将它们作为道具传递给Input，在本例中是CheckboxGroupInput。

这两个函数的代号。

parse(): input -> record

format(): record -> input

<CheckboxGroupInput 
    source="binded_cameras" 
    choices={choices}
    parse={ids => ids.map(id => ({id}))}
    format={bindedCameras => bindedCameras.map(b => b.id)}
/>

https:/marmelab.comreact-adminInputs.html#transforming-input-value-tofrom-record。