在節點上查詢后，relayjs 不更新存儲

Question

架構：

interface Node {
  id: ID!
}

type Product implements Node {
  created: Int
  id: ID!
  images: [Img]
  name: String!
  price: Price
  prices: [Price]
}

type Error implements Node {
  id: ID!
  message: String
}

產品查詢：

  query ProductQuery($id: ID!) {
    node(id: $id) {
      id
      ... on Product {
        name
      }
      ... on Error {
        message
      }
    }
  }

產品列表查詢：

 query ProductsListQuery @preloadable {
    products {
      id
      created
      name
      price {
        id
        unit_amount
      }
    }
  }

兩個查詢的加載方式與entrypoints相同。 當我啟動products list query時，我在商店中擁有我需要的一切： 這是查詢的結果：

{
    "data": {
        "products": [{
            "id": "UHJvZHVjdDpmNTc4YjYxOS0xMWFiLTRlMWUtOWEzOC1kNjNiYjQ3NzI5Njc=",
            "created": 1656888677,
            "name": "Name",
            "price": {
                "id": "UHJpY2U6NTQ1YzA0ZGEtZDNmYi00N2UyLWJiODEtMTgzMTA2MWJiN2Nl",
                "unit_amount": 1000
            }
        }, {
            "id": "UHJvZHVjdDozZTE2YjhkZS0xOTgxLTQxMGQtYjdlYy00ZmFjODZkY2ExY2E=",
            "created": 1656888738,
            "name": "Name 2",
            "price": null
        }, {
            "id": "UHJvZHVjdDoxODcxMjljNC1iZmE4LTQ0ZmItOWE3Ni1mYjY2YmUxOGFhYmY=",
            "created": 1656889591,
            "name": "Name 2",
            "price": null
        }]
    }
}

當我使用正確的 ID 啟動product query時，查詢結果如下：

{
    "data": {
        "node": {
            "__typename": "Product",
            "id": "UHJvZHVjdDoxODcxMjljNC1iZmE4LTQ0ZmItOWE3Ni1mYjY2YmUxOGFhYmY=",
            "name": "Name 2"
        }
    }
}

但我在商店里什么都沒有： 實際上，當我在組件入口點中記錄數據時，我有undefined ：

const Query = graphql`
  query ProductQuery($id: ID!) {
    node(id: $id) {
      id
      ... on Product {
        name
      }
      ... on Error {
        message
      }
    }
  }
`;

const Product: Relay.EntryPointComponent<
  {
    productQueryRef: ProductQuery;
  },
  {}
> = ({ queries }) => {
  const data = Relay.usePreloadedQuery(Query, queries.productQueryRef);
  console.log(data); // --> { node: undefined }
  return <div>product</div>;
};

編輯

即使使用這樣的常規查詢，它也不起作用：

  query ProductQuery($id: ID!) {
    productById(id: $id) {
      __typename
      id
      name
    }
  }

Answer 1

好的，我只是忘了添加@preloadable指令：

const Query = graphql`
  query ProductQuery($id: ID!) @preloadable {
    node(id: $id) {
      id
      ... on Product {
        name
      }
      ... on Error {
        message
      }
    }
  }
`;