使用 Controller 组件，需要什么才能在 TextFields 中显示标签？

Question

使用 React-admin，我正在使用 ShowController 组件，这让我可以更自由地自定义 ShowView。但是，我想继续在 TextFields 中看到标签，但是，它们不见了。

这段代码展示了我是如何使用 ShowController 的，它部分工作：只显示记录值，而不是标签（我也试过没有道具 "label"，它也不起作用).

const OrderShow = props => {
    return (<ShowController {...props}>
        {controllerProps => {
            return (
                <Grid container spacing={8}>
                     <Grid item xs={3}>
                         <TextField label="ID" source="id" {...controllerProps} />
                         ...

在 ShowView 标准组件中显示标签缺少什么？

Answer 1

TextFields 的标签通常由 source 属性填充。如果您想使用带有自定义布局的 <ShowController> 组件，我建议您创建另一个自定义组件并在 <Show>、<ShowView> 或 <SimpleShowLayout>.[=18= 中使用它]

我用 SimpleForm 组件包装了字段，以便能够显示它们的标签并使用自定义 CardActions 隐藏工具栏。

示例：

const FormToolbar = () => (
 <CardActions style={{display: 'none'}}>
 </CardActions>
);

const FormDiv = ({controllerProps, ...props}) => (
 <Grid container spacing={24}>
   <Grid item xs={12}>
     <SimpleForm toolbar={<FormToolbar/>}>
      <TextField {...props} record={controllerProps.record} source="name"/>
     </SimpleForm>
 </Grid>
</Grid>
);

const OrderShow = props => (
 <ShowController {...props} title="Order">
    {controllerProps =>
        <Show actions={<ShowActions pageType="show" />} {...props} {...controllerProps}>
            <SimpleShowLayout>
                <FormDiv controllerProps={controllerProps} />
            </SimpleShowLayout>
        </Show>
    }
</ShowController>
);

export default OrderShow;

使用 Controller 组件，需要什么才能在 TextFields 中显示标签？

Using the Controller components, what is needed to show the Label in the TextFields?

reactjs

react-admin