增加滚动条的大小 react-custom-scrollbar答案

【问题标题】：increase size of scrollbar react-custom-scrollbar增加滚动条的大小 react-custom-scrollbar
【发布时间】：2019-03-04 03:57:30
【问题描述】：

我正在使用the react-scrollbar 库，其中contains demos here。

我想弄清楚如何增加滚动条的大小，但遇到了困难

import React, { Component } from 'react';
import { Scrollbars } from 'react-custom-scrollbars';

export default class App extends Component {
    render() {
        return (
            <Scrollbars
                style={{ width: 300 }}>
                <p>Lorem ipsum dolor justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
                <p>Lorem consetetur</p>
                <p>Lorem ipsum anctus est Lorem ipsum dolor sit amet.</p>
            </Scrollbars>
        );
    }
}

width 这里改变了实际div 的宽度，而不是滚动条。

有谁知道如何增加实际滚动条的宽度？

【问题讨论】：

标签： javascript reactjs scrollbar

【解决方案1】：

你需要使用renderThumbVertical

<Scrollbars
    renderThumbVertical={({ style, ...props }) =>
        <div {...props} style={{ ...style, width: '60px' }}/>
}>

 <p>Content</p>

</Scrollbars>

【讨论】：

【解决方案2】：

如果发生你无法让它工作！

然后知道您需要提供基本样式。在这里查看我的答案https://stackoverflow.com/a/54973078/7668448

【讨论】：