版本
4.1.1
重现步骤
感谢 Apollo,该组件正在通过 GraphQL 查询数据库。它是一个 GraphQL 容器。它使用compose
from react-apollo
library 以便以可读的方式同时使用多个增强器。
示例组件:
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { graphql, compose, withApollo } from 'react-apollo';
import { myQuery } from './graphqlQuery';
class MyComponent extends Component {
render() {
const { exampleProp } = this.props;
return null;
}
}
function mapStateToProps(state, ownProps) {
// I expect to see ownProps.exampleProp here but it is undefined
console.log(ownProps.exampleProp);
}
export default compose(
withApollo,
connect(mapStateToProps),
graphql(myQuery),
)(MyComponent);
预期行为
ownProps 应该包含传递给组件的道具,如下所述
:
Object = {
client: ApolloClient
exampleProp: "propcontent", // <-- this is going to be lost
history: Object
location: Object
match: Object
staticContext: undefined
__proto__: Object
}
实际行为
相反,ownProps 仅包含以下内容:
Object = {
client: ApolloClient
history: Object
location: Object
match: Object
staticContext: undefined
__proto__: Object
}
组件应该从父级和 GraphQL 响应中获得的所有道具都丢失了,在这种情况下,包括exampleProp
.