Question

我正在我的前端使用admin-on-rest。但是当我单击列表页面中的“编辑”按钮时，它会成功定位到“编辑”页面，但总会出现“INCORRECT ELEMENT”之类的错误。你知道为什么吗？

谢谢

App.js

import { DataTypeList } from './Components/DataType/DataTypeList';
import { FeatureList } from './Components/FeatureList';
import { DataPointTypeList } from './Components/DataPointTypeList';
import DashBoard from './Components/DashBoard';
import { DataTypeCreate } from './Components/DataType/DataTypeCreate';
import { DataTypeEdit } from './Components/DataType/DataTypeEdit';

const httpClient = (url, options = {}) => {
    if (!options.headers) {
        options.headers = new Headers({ Accept: 'application/json' });
    }

    // add your own headers here
    options.headers.set('X-Custom-Header', 'foobar');
    return fetchUtils.fetchJson(url, options);
}
const restClient = jsonServerRestClient('http://localhost:3001/designer', httpClient);

const App = () => (
    // <Admin title="GAMMA" dashboard={DashBoard} restClient={jsonServerRestClient('https://arcane-citadel-28609.herokuapp.com/designer')}>
    <Admin title="GAMMA" dashboard={DashBoard} restClient={restClient}>
        <Resource name="datatypes" list={DataTypeList} create={DataTypeCreate} edit={DataTypeEdit} />
        <Resource name="features" list={FeatureList} />
        <Resource name="datapointtypes" list={DataPointTypeList} />
    </Admin>
);

export default App;

DataTypeEdit.js

import React from 'react';
import { Create, Edit, SimpleForm, TextInput } from 'admin-on-rest';
import { DataTypeActions } from '../Actions/DataTypeActions';
import { DataTypeEditActions } from '../Actions/DataTypeEditActions';

export const DataTypeEdit = (props) => (
    <Edit title="Data Type - EDIT" actions={<DataTypeEditActions /> {...props}>
        <SimpleForm>
            <TextInput source="id" label="Name"/>
        </SimpleForm>
    </Edit>
);

DataTypeEditActions.js

import React from 'react';
import { CardActions } from 'material-ui/Card';
import FlatButton from 'material-ui/FlatButton';
import { DeleteButton, ListButton, RefreshButton, ShowButton, Edit } from 'admin-on-rest';

const cardActionStyle = {
    zIndex: 2,
    display: 'inline-block',
    float: 'right',
};

export const DataTypeEditActions = ({ basePath, data }) => (
    <CardActions style={cardActionStyle}>
        <ListButton basePath={basePath} />
        <DeleteButton basePath={basePath} record={data} />
        <RefreshButton />
    </CardActions>
)

Answer 1

如果结果的ID与请求的ID不匹配，也会出现此错误。

Answer 2

问题是你的json数据，试着返回{“id”：“1”，“name”：“test”，“type”：“test”}，而不是数组。

Admin-on-rest，编辑页面 - 错误的元素错误

2 个答案: