在React ASP.NET应用程序中为关系数据构造Redux状态

时间:2019-07-27 16:05:05

标签: reactjs redux react-redux react-hooks

我有一个页面,其中列出了A个实例,每个实例都包含B的实例。

 A item 1
      B item 1
      B item 2
 A item 2
      B item 3

通常,A的归约器reducerA包含一个数组,用于保存B的实例:

 ItemsA : [] as any
 ItemsB : [] as any

ItemsA包含一个相关B项ID的整数数组,称为relatedBs。当我阅读它们列出的内容时,我可以轻松做到:

 Object.keys(reducerA.ItemsA).map(itemAId=>{
      return (
           <div>{reducerA.ItemsA[itemAId].title}</div>
           {
               reducerA.ItemsA[itemAId].relatedBs.map(itemBId=>{
                    return (<div>reducerA.ItemsB[itemBId].title</div>)
               }
           }
      )
 })

这在编码方面非常方便。但是,reducerA.ItemsB听起来是错误的。

我可以创建另一个减速器reducerB

 ItemsB : [] as any

但是,从数据库中获取它们变得很复杂。我需要传递A的每个实例的ID来获取它们。

使用useEffect钩子获取itemsA

  useEffect(()=>{
      props.fetchItemsA();

  }, [])

在其中,我可以添加props.fetchItemsB(itemA_id),但是我需要id的每个实例的A,这使事情变得有些复杂。一种解决方案是将实例A的所有id传递给数组? `props.fetchItemsB(itemA_IDs_all)。

我想知道是否应该继续使用当前的解决方案。有什么建议吗?

0 个答案:

没有答案