中继：在Fragment内使用常量而不是graphql` ...

Question

中继 createFragmentContainer 是有用的功能，并且易于使用：

NVARCHAR(MAX)

问题是，当查询位于我文件的末尾时，确实很难阅读代码。我更喜欢在导入后将其放在右上角。像这样：

const MyComponent = createFragmentContainer(
    MyFragmentComponent,
    {
        job: graphql`
            fragment MyComponent_job on Job {
                id
            }
        `
    }
);

但是中继编译器在这种情况下会引发错误：const QUERY_FRAGMENT = graphql` fragment MyComponent_job on Job { id } ` // Main code here const MyComponent = createFragmentContainer( MyFragmentComponent, { job: QUERY_FRAGMENT } );

是否可以将FindGraphQLTags: 'createFragmentContainer' expects fragment definitions to be 'key: graphql'.和createFragmentContainer分开？

Answer 1

这似乎是babel-plugin-relay的已知问题。如this issue中所述，解决方法是更改​​导入：

import Relay, { graphql } from 'react-relay'

const fragment = graphql`...`

...

Relay.createFragmentContainer(Component, fragment)