[英]Graphene-django - How to catch response of query?
I use django and django graphene for make a graphql API. 我使用django和django石墨烯制作了graphql API。
In the view of my application, I use reactJS and react-bootstrap-table . 在我的应用程序看来,我使用reactJS和react-bootstrap-table 。 React-bootstrap-table expects that I pass it an object array but does not support nested objects . React-bootstrap-table期望我向它传递一个对象数组,但不支持嵌套对象 。
I created query in my schema.py : 我在schema.py中创建了查询:
class ApplicationNode(DjangoObjectType):
class Meta:
model = Application
filter_fields = ['name', 'sonarQube_URL']
interfaces = (relay.Node,)
class Query(ObjectType):
application = relay.Node.Field(ApplicationNode)
all_applications = DjangoFilterConnectionField(ApplicationNode)
The answers to these queries are JSON nested objects like this: 这些查询的答案是像这样的JSON嵌套对象:
{
"data": {
"allApplications": {
"edges": [
{
"node": {
"id": "QXBwbGljYXRpb25Ob2RlOjE=",
"name": "foo",
"sonarQubeUrl": "foo.com",
"flow":{
"id": "QYBwbGljYXRpb45Ob2RlOjE=",
"name": "flow_foo"
}
}
},
{
"node": {
"id": "QXBwbGljYXRpb25Ob2RlOjI=",
"name": "bar",
"sonarQubeUrl": "bar.com"
"flow":{
"id": "QXBwbGljYXRpb26Ob2RlOjA=",
"name": "flow_bar"
}
}
}
]
}
}
}
I have to put them flat before giving them to React-bootstrap-table. 在将它们放到React-bootstrap-table之前,我必须将它们放平。
What is the better way, intercept the results of graphene-django queries to put them flat or make this job in ReactJS view? 有什么更好的方法来拦截graphene-django查询的结果以将其放平或在ReactJS视图中进行此工作?
If the first way is better, how to intercept the results of graphene-django queries to put them flat? 如果第一种方法更好,如何截取graphene-django查询的结果以使其平整?
The best thing to do is to wrap react-bootstrap-table in a new component. 最好的办法是将react-bootstrap-table包装在一个新组件中。 In the component massage the relay props into a flat structure as needed for react bootstrap table. 在组件按摩中,根据需要将接力支柱变成一个扁平结构,以应对自举表。
For example: 例如:
MyReactTable = ({allApplications}) => {
let flatApplications = allApplications.edges.map(({node: app}) => {
return {
name: app.name,
sonarQubeUrl: app.sonarQubeUrl,
flowName: app.flow.name
};
});
return (
<BootstrapTable data={flatApplications} striped={true} hover={true}>
<TableHeaderColumn dataField="name" isKey={true} dataAlign="center" dataSort={true}>Name</TableHeaderColumn>
<TableHeaderColumn dataField="sonarQubeUrl" dataSort={true}>Sonar Qube Url</TableHeaderColumn>
<TableHeaderColumn dataField="flowName" dataFormat={priceFormatter}>Flow Name</TableHeaderColumn>
</BootstrapTable>
);
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.