Reactjs 带有嵌套CheckBoxGroupInput的ReferenceInput行为异常

Reactjs 带有嵌套CheckBoxGroupInput的ReferenceInput行为异常,reactjs,graphql,react-admin,Reactjs,Graphql,React Admin,我已经环顾四周好几个小时了,尝试了各种各样的方法,但是我看到的CheckBoxGroupInput的很多示例都只是有一个硬编码的相关选项列表,这有点无用。。。我的场景是,我有一个标签列表,我希望能够与产品关联,非常常见的东西 我需要从postgres数据库中获取该列表。。。这一部分似乎都很有效,当我的列表第一次出现在react admin的创建屏幕上时看起来很正常。。。控件如下所示 <ReferenceInput reference="ProductRealBenefit" source=

我已经环顾四周好几个小时了,尝试了各种各样的方法,但是我看到的CheckBoxGroupInput的很多示例都只是有一个硬编码的相关选项列表,这有点无用。。。我的场景是,我有一个标签列表,我希望能够与产品关联,非常常见的东西

我需要从postgres数据库中获取该列表。。。这一部分似乎都很有效,当我的列表第一次出现在react admin的创建屏幕上时看起来很正常。。。控件如下所示

<ReferenceInput reference="ProductRealBenefit" source="realbenefits" sort={{ field: 'name', order: 'ASC' }}>
     <CheckboxGroupInput source="name" />                                                      
</ReferenceInput>

到目前为止这一切都很好

它按预期呈现我的列表。。我已经根据ra_data_graphql_simple的格式设置了所有模式。。。出乎意料的是,只要我单击其中一个标记,它就会立即向服务器发送一个allProductRealBenefit查询请求,其筛选值等于单击的id,并将该单击标记的副本添加到列表中,该列表会因重复键错误而断开控件。。。我不明白为什么它会在我点击后发送请求,我没有试图保存任何东西,只是组装哪些标签将与表单数据一起发送以创建链接记录,并且在控件初始填充后,我已经拥有了所有这些数据


我猜这可能不应该嵌套在ReferenceInput中,但我看不到用数据库查询结果填充选择的任何其他方法。我知道这是非常常见的功能&我需要找出一种方法在多个地点使用它,因为这种标记功能应该在多个资源中可用。。我也尝试过使用AutocompleteArrayInput,它也有类似的问题,所以我知道问题是我肯定错过了一个重要的步骤。。。。如果有人能指出正确的方向,那就太棒了。我现在要回到文档,看看我能找到什么

好吧,我要回答我的另一个问题,以防有人像我提问时一样从上到下降落。。。我只是没有意识到一些幕后魔术在做什么,所以我用错了这个。。。我发现这些文件令人困惑

在我上面的例子中。。。引用中的我的ProductRealBenefits是在我的模式中表示的一对多关系,它与realbenefits:[ProductRealBenefits]。。。因此,我需要以下组件

<ReferenceArrayInput label="Real Benefit Tags" source="realbenefitsIds" reference="ProductRealBenefit">
    <CheckboxGroupInput  optionValue="id" optionText="name" allowEmpty />
</ReferenceArrayInput>

ra_data_graphql_simple dataProvider中有一点神奇之处,它在状态下为您创建一个名为realbenefitsIds的项,这是您用作ReferenceArrayInput源的项,我试图使用实际的realbenefits数组对象,但这行不通。我找不到任何好的例子,也找不到任何像样的解释来说明如何让这项工作发挥作用。。。所以最终是Redux开发工具救了我的命。我不得不在graph服务器中跳过一些障碍,让所有这些与数据提供程序一起工作,为get_MANY和get_REFERENCE_MANY筛选器值返回不同的内容,但这只是解析筛选器参数以匹配sequelize所期望的内容的问题。我最终会写一个数据提供者,但这符合目前的要求

附言。。我在CheckboxGroupInput中看到一些奇怪的行为,当我单击某个东西时,它复制了单击的任何框。。。原因是我的架构中的对象类型错误。。。有一个IntID混合在一起,幸运的是,它出现在Redux开发工具中,并导致了这个问题


最后。。我正在Github中创建一个示例项目,它将使用React Admin、GraphQL、RA_DATA_GraphQL_SIMPLE、Sequelize和Postgres数据库,我将对它进行大量注释,以消除像我这样的人的一些困惑。。。干杯

我现在对复选框也有同样的问题。您的解决方案对我不起作用(我正在与一个REST提供商进行斗争),所以祝我好运,当我点击一个解决方案时,会发现发生了什么。谢谢你发布这个问题和答案。现在请大家投票并发表评论:它确实有效。我忘记将
ReferenceInput
更改为
ReferenceArrayInput
。我仍然不理解
${RESOURCE}Ids
的内部工作原理,但是,我更进一步了。谢谢哦,很好,我刚看到这个,正要回去给你看。。。很高兴你成功了!!干杯