무한 스크롤 scrollableTarget 반응 동적으로 ID를 얻습니까?

Question

내 프로젝트에서 react-infinite-scroll-component를 사용합니다. scrollableTarget이 동적으로 항목 ID를 얻도록하려면 어떻게해야합니까? 나는 이렇게 시도했지만 scrollableTarget={item.id}작동하지 않았습니다. 이 div와 동일한 ID를 가져야합니다.id={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>;
  }

Answer 1

문제는 이렇게 해결된다 scrollableTarget={item.id.toString()}