我正在尝试将<ReferenceInput>
元素与自定义数据提供程序结合使用,并收到此错误:
缺少键的翻译:“ dataProvider未定义”
即使我的数据提供者看起来像这样,也会发生:
import jsonServerProvider from "ra-data-json-server";
import { adminPageTokenFetch } from "APIServices/CRUD";
const dataProvider = jsonServerProvider("/api", adminPageTokenFetch);
export const myDataProvider = {
...dataProvider
}
使用<ReferenceInput>
的组件示例:
export const SessionEdit = (props: any) => {
return (
<Edit {...props}>
<SimpleForm>
<ReferenceInput source="film" reference="films">
<SelectInput optionText="name" />
</ReferenceInput>
<DateInput source="dateTime" />
<NumberInput source="price" />
<ReferenceInput source="genre" reference="genres">
<SelectInput optionText="name" />
</ReferenceInput>
</SimpleForm>
</Edit>
);
};
这是我的索引页:
export const AdminPage = (props: { lang: string }) => {
const messages = {
ru: russianMessages,
en: englishMessages
} as any;
return (
<Provider store={createAdminStore({ myDataProvider, history })}>
<Admin
dataProvider={myDataProvider}
history={history}
title={props.lang === "ru" ? "Админ панель" : "My admin"}
i18nProvider={polyglotI18nProvider(() => messages[props.lang])}
>
<Resource
name="sessions"
list={SessionList}
edit={SessionEdit}
create={SessionCreate}
/>
<Resource name="translations" list={TranslationList} />
</Admin>
</Provider>
);
};
这里是createAdminStore
函数:
export default ({ dataProvider, history }: any) => {
const reducer = combineReducers({
admin: adminReducer,
router: connectRouter(history)
});
const saga = function* rootSaga() {
yield all([adminSaga(dataProvider)].map(fork));
};
const sagaMiddleware = createSagaMiddleware();
const store = createStore(
reducer,
compose(applyMiddleware(sagaMiddleware, routerMiddleware(history)))
);
sagaMiddleware.run(saga);
return store;
};
UI上的外观:
其他组件仍然可以正常工作。
默认情况下,每次调用时,polyglotI18nProvider
都会在console
中记录一条警告,并带有一条当前翻译中找不到的消息。