**-- Relay Transform Error -- delete-customer-mutation.js --**
Error: types.getNamedType(...).getFields is not a function
File: D:/development/wfc_admin/js/mutations/delete-customer-mutation.js
**-- GraphQL Validation Error -- delete-customer-mutation.js --**
Error: Unknown type "DeleteWidgetPayload".
File: D:/development/wfc_admin/js/mutations/delete-customer-mutation.js
Source:
>
> fragment Delete on DeleteWidgetPayload @relay(pattern: true) {
> ^^^
**Package file:**
**dependencies**
"babel": "5.8.21",
"babel-loader": "5.3.2",
"babel-relay-plugin": "^0.1.1",
"classnames": "^2.1.3",
"express": "^4.13.1",
"express-graphql": "^0.5.3",
"graphql": "^0.6.0",
"graphql-relay": "^0.4.2",
"mongoose": "~4.1.7",
"react": "^0.14.0-rc",
"react-dom": "^0.14.0-rc",
"react-relay": "^0.3.1",
"react-router": "^2.8.1",
"webpack": "^1.10.5",
"webpack-dev-server": "^1.10.1"
**Container file Code**
ReactDOM.render(
<Relay.RootContainer
Component={CustomerToolContainer}
//TODO Update userId
route={new AppViewRoute()}
/>,
document.getElementById('root')
);
**CustomerToolContainer is calling from customer-tool-container.js**
import Relay from 'react-relay';
import CustomerTool from '../components/Customer_tool';
import DeleteCustomerMutationType from '../mutations/delete-customer-mutation';
export default Relay.createContainer(CustomerTool, {
fragments: {
viewer: () => Relay.QL`
fragment on Viewer {
id
customers {
id
name
address
}
${DeleteCustomerMutationType.getFragment('viewer')}
}
`
}
});
Customer_tool正在从Customer_tool.js 进行调用 这是调用DeleteCustomerMutation的代码。 我收到错误,任何人都可以指导我为这个问题需要做些什么。还在DeleteWidgetPayload上获取错误片段删除
import Relay from 'react-relay';
import React from 'react';
import CustomerList from './CustomerList.js';
import Customer from './Customer.js';
import CustomerRowComponent from './Customer_row';
import CustomerTableComponent from './Customer_table';
import DeleteCustomerMutation from '../mutation/delete-customer-mutation';
export default class CustomerTool extends React.Component {
constructor(props) {
super(props);
this.state = { editCustomerId: null };
this._saveCustomer = this._saveCustomer.bind(this);
this._editCustomer = this._editCustomer.bind(this);
this._cancelEditCustomer = this._cancelEditCustomer.bind(this);
this._deleteCustomer = this._deleteCustomer.bind(this);
}
_appendCustomer(customer) {
Relay.Store.commitUpdate(new InsertCustomerMutation(Object.assign({
viewer: this.props.viewer, customer: null }, customer)));
}
_updateCustomer(customer) {
//Relay.Store.commitUpdate(new UpdateWidgetMutation(
//Object.assign({ viewer: this.props.viewer, customer: customer }, customer)
//));
}
_saveCustomer(customer) {
if (customer.id !== -1)
{
this._updateCustomer(customer);
}
else
{
alert(customer);
//this._appendCustomer(customer);
}
this.setState({ editCustomerId: null });
}
_editCustomer(customer) {
alert(customer.id);
this.setState({ editCustomerId: customer.id });
}
_cancelEditCustomer() {
this.setState({ editCustomerId: null });
}
_deleteCustomer(customer) {
//alert(customer.name);
Relay.Store.commitUpdate(new DeleteCustomerMutation ({
viewer: this.props.viewer,
customer,
customerId: customer.id
}));
}
render() {
let viewer = this.props.viewer;
return (
<div>
<CustomerTableComponent
editCustomerId={this.state.editCustomerId}
onSave={this._saveCustomer}
onEdit={this._editCustomer}
onCancelEdit={this._cancelEditCustomer}
onDelete={this._deleteCustomer}
customers={viewer.customers}/>
</div>
);
}
}
以下是delete-customer-mutation.js的代码
import Relay from 'react-relay';
export default class extends Relay.Mutation {
static fragments = {
viewer: () => Relay.QL`fragment on Viewer { id }`
}
getMutation() {
return Relay.QL`mutation { deleteCustomer }`;
}
// receives the parameters from the constructor, builds
// the variables to send the GraphQL server
getVariables() {
return {
customerId: this.props.customerId
};
}
getConfigs() {
return [{
// delete operation
type: 'NODE_DELETE',
// triggers update from container fragment viewer id
// this is the name of property from the output field
parentName: 'viewer',
// id of viewer being updated
parentID: this.props.viewer.id,
// name of the connection on the viewer
connectionName: 'customers',
// fat query payload field name of the id for the deleted node
deletedIDFieldName: 'customerId'
}];
}
getFatQuery() {
// corresponds to the structure of the output types
// patten is used to not specify the parameters for the connections
return Relay.QL`
fragment on DeleteCustomerPayload @relay(pattern: true) {
viewer {
customers {
edges {
node {
id
name
description
color
size
quantity
owner {
id
firstName
lastName
}
}
}
}
}
customerId
}
`;
}
}