Question

我试图在我创建的React组件上调用几个函数，特别是来自react-apollo的graphql()函数

我使用的模式：

import someFunction from "../somewhere";

const withData = compose(
  graphql(gqlDocument, { name: "Name" }),
  graphql(anotherDocument, { name: "Name2" }),
  someFunction()
  ...
)
const ComponentWithData = withData(Component);
export default ComponentWithData

这很好用，除非我尝试使用我在另一个文件中定义并导入的函数。尽管字面上的格式完全相同，即graphql(document, { name: "Name" })我收到错误：Uncaught TypeError: Cannot read property 'apply' of undefined。如果我只是简单地从外部模块复制并粘贴该函数并将其放在compose块中，它就可以完美地运行，因此问题必须在于反应如何在此函数组合中处理apply。

当函数有效时，它ComponetWithData应该有一个名为＆＃34; Name＆＃34;表示传递给graphql()函数的graphql文档。这尤其令人困惑，因为react-apollo的订阅实现让你将React组件传递给改变其props的函数，但我可以在外部定义订阅函数而不会有麻烦。这是参考模式：

const COMMENTS_SUBSCRIPTION = gql`
    subscription onCommentAdded($repoFullName: String!){
      commentAdded(repoFullName: $repoFullName){
        id
        content
      }
    }
`;
const withData = graphql(COMMENT_QUERY, {
    name: 'comments',
    options: ({ params }) => ({
        variables: {
            repoName: `${params.org}/${params.repoName}`
        },
    }),
    props: props => {
        return {
            subscribeToNewComments: params => {
                return props.comments.subscribeToMore({
                    document: COMMENTS_SUBSCRIPTION,
                    variables: {
                        repoName: params.repoFullName,
                    },
                    updateQuery: (prev, {subscriptionData}) => {
                        if (!subscriptionData.data) {
                            return prev;
                        }
                        const newFeedItem = subscriptionData.data.commentAdded;
                        return Object.assign({}, prev, {
                            entry: {
                                comments: [newFeedItem, ...prev.entry.comments]
                            }
                        });
                    }
                });
            }
        };
    },
});

Answer 1

虽然我没有让它在compose块中工作，但我确实找到了一个可接受的解决方案：

const myFunc = compose(
  // graphql stuff here
);
const updated = myImportedFunc(Component);
const CompWGraphql = myFunc(updated);

graphql如何将对象从一个函数传递到另一个函数到另一个函数中只是一个问题，只是在compose块之外调用它并将结果赋给一个新变量给了我想要的结果。

使用导入的函数调用React组件

1 个答案: