SelectInputと組み合わせたReferenceInputフィールドでは、次のように列の名前を指定することにより、参照されるリソースの列からオプションテキストを入力できます。
<ReferenceInput label="Location name" source="id" reference="Location">
<SelectInput optionText={"building"} />
</ReferenceInput>
複数の列のオプションテキストを結合したいのですが、現在のレコードにアクセスする方法がわかりません。私はこのコードのようなことを達成したいと思っています(もちろん、私が何を意味するかを示すためだけに、それは機能しません):
<ReferenceInput label="Location name" source="id" reference="Location">
<SelectInput optionText=`${record.building} ${record.room}` />
</ReferenceInput>
optionText
関数も受け入れるので、オプションのテキストを自由に形作ることができます。
const choices = [
{ id: 123, first_name: 'Leo', last_name: 'Tolstoi' },
{ id: 456, first_name: 'Jane', last_name: 'Austen' },
];
const optionRenderer = choice => `${choice.first_name} ${choice.last_name}`;
<SelectInput source="author_id" choices={choices} optionText={optionRenderer} />
optionText
また、React Elementを受け入れます。これは複製され、関連する選択肢をrecord
小道具として受け取ります。そこでフィールドコンポーネントを使用できます。
const choices = [
{ id: 123, first_name: 'Leo', last_name: 'Tolstoi' },
{ id: 456, first_name: 'Jane', last_name: 'Austen' },
];
const FullNameField = ({ record }) => <span>{record.first_name} {record.last_name}</span>;
<SelectInput source="gender" choices={choices} optionText={<FullNameField />}/>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加