2017-09-29 93 views
0

我們正在將AOR(版本1.2.3)與現有應用程序集成。 我們試圖提供編輯功能中,當我們給 < ---現場>組件其做工精細 也能夠看到SAVE按鈕 但 當< ---輸入>組件 沒有SAVE按鈕是可見的,組件確實需要輸入。輸入組件不能正常工作

當使用 場分量代碼

import React, { Component } from 'react'; 
 
import { 
 
Components 
 
} from 'admin-on-rest'; 
 
    
 
const CustomerEdit = (props) => (
 
<Edit {...this.props}> 
 
     <TabbedForm> 
 
      <FormTab label="Profile"> 
 
       <TextField source="firstName" /> 
 
       <TextField source="middleName" /> 
 
       <TextField source="lastName" /> 
 
      </FormTab> 
 
      <FormTab label="Address"> 
 
      <ReferenceManyField addLabel={false} reference="CustomerAddresses" target="customerProfileId"> 
 
       <Datagrid> 
 
       <EditButton/> 
 
       <TextField source="id" /> 
 
       <TextField source="line1" /> 
 
       <TextField source="pinCode" /> 
 
       </Datagrid> 
 
      </ReferenceManyField> 
 
      </FormTab> 
 
      </TabbedForm> 
 
    </Edit> 
 
    ); 
 
    export default CustomerEdit;

當使用 輸入 組件的代碼

import React, { Component } from 'react'; 
 
import { 
 
Components 
 
} from 'admin-on-rest'; 
 
    
 
const CustomerEdit = (props) => (
 
<Edit {...this.props}> 
 
     <TabbedForm> 
 
      <FormTab label="Profile"> 
 
       <TextInput source="firstName" /> 
 
       <TextInput source="middleName" /> 
 
       <TextInput source="lastName" /> 
 
      </FormTab> 
 
      <FormTab label="Address"> 
 
      <ReferenceManyField addLabel={false} reference="CustomerAddresses" target="customerProfileId"> 
 
       <Datagrid> 
 
       <EditButton/> 
 
       <TextInput source="id" /> 
 
       <TextInput source="line1" /> 
 
       <TextInput source="pinCode" /> 
 
       </Datagrid> 
 
      </ReferenceManyField> 
 
      </FormTab> 
 
      </TabbedForm> 
 
    </Edit> 
 
    ); 
 
    export default CustomerEdit;

這是App.js

import React from 'react'; 
 
import PropTypes from 'prop-types'; 
 

 
// redux, react-router, redux-form, saga, and material-ui 
 
// form the 'kernel' on which admin-on-rest runs 
 
import { combineReducers, createStore, compose, applyMiddleware } from 'redux' 
 
import { Provider } from 'react-redux' 
 
import createHistory from 'history/createHashHistory' 
 
import { Switch, Route } from 'react-router-dom' 
 
import { ConnectedRouter, routerReducer, routerMiddleware } from 'react-router-redux'; 
 
import { reducer as formReducer } from 'redux-form'; 
 
import createSagaMiddleware from 'redux-saga'; 
 
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider'; 
 

 

 
// prebuilt admin-on-rest features 
 
import { 
 
    adminReducer, 
 
    localeReducer, 
 
    crudSaga, 
 
    TranslationProvider, 
 
} from 'admin-on-rest'; 
 

 
import restClient from './restClient'; 
 
import GenericList from './ui/List'; 
 
import CustomerEdit from './ui/views/customer/customerEdit'; 
 

 
const reducer = combineReducers({ 
 
    admin: adminReducer([{ name: 'CustomerProfiles' }, 
 
    { name: 'CustomerAddresses' }]), 
 
    locale: localeReducer(), 
 
    form: formReducer, 
 
    routing: routerReducer, 
 
}); 
 
const sagaMiddleware = createSagaMiddleware(); 
 
const history = createHistory(); 
 

 
const store = createStore(reducer, undefined, compose(
 
    applyMiddleware(sagaMiddleware, routerMiddleware(history)), 
 
    window.devToolsExtension ? window.devToolsExtension() : f => f, 
 
)); 
 

 
sagaMiddleware.run(crudSaga(restClient)); 
 

 
const App =() => (
 
    <Provider store={store}> 
 
    <TranslationProvider messages={messages}> 
 
     <ConnectedRouter history={history}> 
 
     <MuiThemeProvider> 
 
      <Switch> 
 
      <Route exact path="/profile" 
 
       hasCreate render={ 
 
       (routeProps) => <GenericList resource="CustomerProfiles" {...routeProps} /> 
 
       } /> 
 
      <Route exact path="/profile/:id" 
 
       hasEdit render={ 
 
       (routeProps) => <CustomerEdit resource="CustomerProfiles" {...routeProps} /> 
 
       } /> 
 
</Switch> 
 
     </MuiThemeProvider> 
 
     </ConnectedRouter> 
 
    </TranslationProvider> 
 
    </Provider> 
 
); 
 

 
export default App
這在輸入組件 No Data from Backend for CustomerAddress and also no Save Button

的情況下,這在現場的情況下的元件

when we use <---FIELD/> Component

+0

您是否錯過了'adminReducer'中的'CustomerAddresses'資源? – Gildas

+0

對不起,我忘了把它放在那裏,但是當甚至CustomerAddresses有,輸出不存在 – Jayesh

回答

0

你不在控制檯中有關於的錯誤?該組件不存在。

我檢查了文檔,我們的確將它包含在Resources chapter中。它會很快修復。

爲了引用許多其他資源,您應該使用ReferenceArrayInput。但是,它不支持Datagrid。沒有組件允許您編輯相關資源。

+0

對不起,其ReferenceManyField只有我忘了提及... 我的錯誤 ReferenceManyField在工作正常時,我工作休息管理實踐項目但是當我試圖整合它的不工作 – Jayesh

+0

你必須更加精確「試圖整合」 – Gildas

+0

好吧, 你看我什麼時候按照集成部分(CustomApp.js)的文檔在現有的應用程序它不是工作很好... – Jayesh