当前位置: 首页 > 知识库问答 >
问题:

Apollo客户端(react)-创建变异更新-“在对象(ROOT\u查询)上找不到field Fund({})”

王声
2023-03-14

使用:“react apollo”:“^1.4.3”

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

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

当我尝试创建新的fundQuarterlyMetrics时,我必须使用更新功能(apollo客户端文档)更新react apollo上的本地存储。这给了我一个错误:

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

问题是,当我console.log代理时,我可以在数据下看到基金和它的孩子......不知道该怎么办...

更新以下评论:

以下是父组件数据请求:

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
}

} `;

解决方案感谢丹尼尔-我必须归还基金ID才能使其正常工作,所以谢谢你!

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

共有1个答案

堵飞鸿
2023-03-14

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

const data = proxy.readQuery({
    query: FundQL.fundPageQuery,
    variables: { id: createFundMetrics.id },
});
 类似资料:
  • 我有以下代码,我正在尝试决定如何处理错误: 服务器发回一个GraphQL错误对象,并将其发回,使其出现在突变的块中。如果变异成功,组件的数据将使用参数更新,但我看不到处理错误的等价方法。 理想情况下,我希望更新块中的Apollo缓存,但在这一点上,我甚至不能向组件或状态注入道具。 最终的结果是在Register组件上设置一个prop/state,它显示了一个带有条件呈现的错误消息组件。一种方法可以

  • 我创建了一个由Apollo客户端和graphQL驱动的react应用程序 定义了我的架构,因此预期结果是一个对象数组(<代码>[{名称:“metric 1”,类型:“type A”},{名称:“metric 2”,类型:“type B”})]) 在jsx文件中,我定义了以下查询: 我用Apollo HOC包装了组件,如下所示: Apollo客户端工作正常,并在渲染方法中返回道具的预期列表。 我想让

  • 如何转换react查询以适应自定义类型?? 注意:我在前端使用的是JavaScipt,而不是Typescript

  • 我的用途是case是一个map组件。我只希望当用户按下按钮时加载标记的数据,但不是在初始组件安装或位置改变时。 下面的代码示例:

  • 我正在尝试使用带有查询的脚本来更新特定的文档,但我不确定我需要使用jest客户端的哪一个类,该客户端与update by query一起工作 而不是_update如何获取_update_by_query

  • 假设Component-TODOList需要以两种不同的方式显示TODO的列表,listview和gridview。假设我想保持两个视图作为不同的组件,那么最佳实践是什么- > 使用graphql查询创建TodoList组件,然后将查询结果传递给TODOListView和TODOGridView组件? 创建没有graphql查询的TodoList组件,然后在ToDoListView和TODOGri