React-Admin DateField，全局DateInput语言环境

Question

React admin允许您在使用DateField和DateInput时在组件上设置日期区域设置。

<DateField source="publication_date" locales="fr-FR" />
// renders the record { id: 1234, publication_date: new Date('2017-04-23') } as
<span>23/04/2017</span>

但是在大多数情况下，我们不需要在组件上进行设置，而是需要在全局上进行配置。有没有一种全局设置的方法？

我曾尝试设置i18n提供程序的默认locale，但看起来仅考虑翻译而不考虑日期格式。

而且我也尝试覆盖Date.toLocaleDateString()，但效果也不佳。

Answer 1

您可以使用useLocale钩子，该钩子返回react-admin的i18nProvider当前语言环境，默认为'en'

https://marmelab.com/react-admin/Translation.html#uselocale-getting-the-current-locale

假设此为显示视图：

import { useLocale } from 'react-admin'

export const ResourceShow = props => {

    const locale = useLocale()

    return (
        <Show {...props}>
            <SimpleShowLayout>
                <DateField source="publication_date" locales={locale} />
            </SimpleShowLayout>
        </Show>
    )
}

并且，如果您确实想重写Date.toLocaleDateString，不建议您使用以下方法，则可以执行以下操作：

Date.prototype.toLocaleDateString = customFunc

顺便说一句，我同意默认情况下应将DateField视为使用i18nProvider区域设置。