Apollo-client (react) - 更新创建突变 - “在对象 (ROOT_QUERY) 上找不到字段 Fund()”

Posted 2023-03-08

【中文标题】Apollo-client (react) - 更新创建突变 - “在对象 (ROOT_QUERY) 上找不到字段 Fund()”

【英文标题】：Apollo-client (react) - Update on create mutation - "Can't find field Fund() on object (ROOT_QUERY)"Apollo-client (react) - 更新创建突变 - “在对象 (ROOT_QUERY) 上找不到字段 Fund()”

【发布时间】：2018-01-14 00:35:18

【问题描述】：

使用：“react-apollo”：“^1.4.3”

在父组件中，我使用 GraphQL 查询父节点“Fund”和子节点“fundQuarterlyMetric”。这将返回以下格式的数据：

      
  id
  name
  ...
  fundQuarterlyMetrics (orderBy: asAtDate_ASC) 
    id
    year
    quarter
    ...
  

当我尝试创建一个新的 fundQuarterlyMetrics 时，我必须使用更新功能 (Apollo Client docs) 更新 react-apollo 上的本地存储。它给了我一个错误：

   Can't find field Fund() on object (ROOT_QUERY) 
     "Fund(\"id\":\"cj57hpfips0x7014414u5tk8m\")": 
     "type": "id",
     "id": "Fund:cj57hpfips0x7014414u5tk8m",
     "generated": false
    

问题是，当我 console.log 代理时，我可以看到 Fund 和它的子数据...不知道该怎么做..

更新以下评论：

这里是父组件数据请求：

export const fundPageQuery = gql`
 query Fund($fundId: ID!) 
Fund(id: $fundId) 
  id
  name
  ....other variables
  fundQuarterlyMetrics (orderBy: asAtDate_ASC) 
    id
    year
    quarter
    ....other variables
  

`;

以下是我使用的选项：

var optionsForCreateFundMetric = 
 update: (proxy, data: createFundMetrics) => 
 try 
  console.log('proxy', proxy);
  const data = proxy.readQuery(query: FundQL.fundPageQuery);
  console.log('data', data);
  data.Fund.fundQuarterlyMetrics.push(createFundMetrics);
  proxy.writeQuery(query: FundQL.fundPageQuery, data)
 catch (e) 
  console.log('error adding to store', e);

;

export default compose(
 graphql(FundQL.createFundMetrics, name: 'createFundMetrics', options: 
 optionsForCreateFundMetric),
 graphql(FundQL.updateFundMetrics, name: 'updateFundMetrics')
 )(FundMetricsForm);

这是我的创建突变：

export const createFundMetrics = gql`
 mutation createFundQuarterlyMetric(
$fundId: ID
$year: Int!
$quarter: FUND_QUARTERLY_METRIC_QUARTER!
$netIRR: Float!
$tvpi: Float!
$rvpi: Float!
$dpi: Float!
$asAtDate: DateTime
$calledThisQuarter: Float!
$distributedThisQuarter: Float!
$cumulativeCalled: Float!
$cumulativeDistributed: Float!
$limitedPartnersNAV: Float!
$quarterlyValuationChangeLCY: Float
$quarterlyTotalReturn: Float
 ) 
createFundQuarterlyMetric(
  fundId: $fundId
  year: $year
  quarter: $quarter
  netIRR: $netIRR
  tvpi: $tvpi
  rvpi: $rvpi
  dpi: $dpi
  asAtDate: $asAtDate
  calledThisQuarter: $calledThisQuarter
  distributedThisQuarter: $distributedThisQuarter
  cumulativeCalled: $cumulativeCalled
  cumulativeDistributed: $cumulativeDistributed
  limitedPartnersNAV: $limitedPartnersNAV
  quarterlyValuationChangeLCY: $quarterlyValuationChangeLCY
  quarterlyTotalReturn: $quarterlyTotalReturn
) 
  id
  year
  quarter
  netIRR
  tvpi
  rvpi
  dpi
  asAtDate
  calledThisQuarter
  distributedThisQuarter
  cumulativeCalled
  cumulativeDistributed
  limitedPartnersNAV
  quarterlyValuationChangeLCY
  quarterlyTotalReturn

`;

解决方案 谢谢 Daniel - 我必须返回基金 ID 才能使其正常工作，所以谢谢！

export default compose(
 graphql(FundQL.createFundMetrics, name: 'createFundMetrics', options: 
optionsForCreateFundMetric, variables: fundId: 
createFundQuarterlyMetric.fund.id),
 graphql(FundQL.updateFundMetrics, name: 'updateFundMetrics')
 )(FundMetricsForm);

【问题讨论】：

听起来您通过 Apollo 执行突变的方式存在问题 - 如果您正在处理突变，您不应该看到有关根查询的错误。请更新您的问题以包含您的代码，特别是在您定义 graphql HOC 和任何相关逻辑的地方（例如您对 update 的调用）。

感谢丹的评论。我已将代码添加到问题中

【参考方案1】：

Apollo 文档在强调这一事实方面做得很差，但是当您调用 readQuery 以从存储中获取先前获取的查询时，如果该查询使用任何变量，您需要传递这些相同的变量来检索它.假设突变返回的 id 是基金的 id，你应该可以只修改这一行：

const data = proxy.readQuery(
    query: FundQL.fundPageQuery,
    variables:  id: createFundMetrics.id ,
);

【讨论】：

感谢 Daniel - 这很有效，所以我必须返回基金 ID 才能使其正常工作 -> fundId: createFundQuarterlyMetric.fund.id 并且成功了！非常感谢！

@Blackstone4 没问题，很高兴你成功了 :) 你仍然可以接受它作为正确答案

我试图用this PR/

来纠正这个糟糕的工作

在我看来，突变应该返回与初始查询一样多的字段。该字段实际上可能会丢失，因为突变没有返回足够的信息来更新查询。解决方案是在突变预期结果中添加缺失字段。