react-scrollbar额外渲染

Question

我有一个带有数据的大表，我只需要水平滚动即可，即时通讯使用react-scrollbar。每个垂直滚动会导致1 * dataCount渲染，我完全不需要这个。我可以在scrollArea附近的其他位置滚动页面，然后没有渲染。我可以避免这种额外的渲染，还是必须使用另一个滚动？

historyRender = (dataArr) => {
    let historyArr = [];
    dataArr.forEach((item) => {
            historyArr.push(<HistoryReceptionsItems {...item}
                                                    personalPage = {this.props.personalPage}
                                                    onGotoChat = {this.props.onGotoChat}/>)
    });

    return historyArr;
};




render(){
    return (
        <div className='receptions-all'>
            <Card title="История обращений">
                <ScrollArea
                    horizontal = {true}
                >
                    <div className={"content"}>

                {this.historyRender(this.props.data)}
                </div>
                </ScrollArea>
              </Card>
        </div>
    )
}