React无限滚动scrollableTarget动态获取id？

我在我的项目中使用react-infinite-scroll-component。如何让scrollableTarget动态获取item id？我试过这样scrollableTarget={item.id}但它不起作用。必须与该 div 具有相同的 idid={item.id}

const Podcast = ({className, data, hasChild}) => {     
     ... 
    return <div>
         <InfiniteScroll
                dataLength={state.list.length}
                next={fetchMoreData}
                hasMore={state.hasMore}
                loader={<h4>Loading...</h4>}
                scrollableTarget={"accordion__panel-1"}
                >
        {state.list && state.list.map((item,i)=>{
            return <div>    
            <div className={classNames('podcast', className)} >
                <div key={item.id} >
                ...
                
               </div>
            {hasChild && <div id={item.id}>
            <InfiniteScroll
                    dataLength={stateChild.children.length}
                    next={fetchMoreDataChildren}
                    hasMore={stateChild.hasMoreChildren}
                    loader={<h4>Loading4...</h4>}
                    scrollableTarget={item.id}
                    >
            { stateChild.children && stateChild.children.map((child, j) => (        
                    <div className={classNames('podcast')}>
                        <div key={child.id} className="podcast--content">
                          ...
                        </div>
                    </div>
                ))}
                </InfiniteScroll>
            </div>}
        </div>
        </div>
        })}
        </InfiniteScroll>
    </div>;
  }

问题是这样解决的scrollableTarget={item.id.toString()}