我一直在用 React 尝试 Apollo,但目前正面临一个问题。
我有一个产品属于许多类别的基本数据
query getProduct{
product(id: 1){
id
name
categories{id,name}
}
}
正如预期的那样,这会返回这样的东西
{
"data": {
"p": {
"id": 1,
"name": "Samsung Galaxy S7",
"categories": [
{
"name": "Phone"
},
{
"name": "Samsung"
}
]
}
}
}
这是我的反应组件
class TileProductComponent extends Component{
constructor(...args){
super(...args)
}
render(){
if(this.props.data.loading)
return <div>Loading...</div>
var product = this.props.data.p
console.log(this.props.data)
return (
<div> {product.name} </div>
)
}
}
var TileProduct = graphql(
gql`
query TestQuery($id: Int!){
product(id: $id){
id
name
categories{id,name}
}
}
`,
{
options : {
variables : {id:1}
}
}
)(TileProductComponent)
但是一旦它在反应组件中传递,我发现它是(来自console.log(this.props.data))
"product": {
"id": 1,
"name": "Phone",
"categories": [
{
"name": "Phone"
},
{
"name": "Samsung"
}
]
}
产品名称不知何故采用第一类名称?我猜id也会。解决方法是更改模式中字段的名称,但在我看来,它不应该真的这样做。
这是一个已知问题还是我是唯一一个遇到这个问题的人?任何建议的解决方案?