Reactjs 下拉框默认值

我正在尝试设置下拉框的默认值。当页面滚动到某个部分时，我可以在下拉列表框中显示活动部分的名称。但如果不是，则下拉框为空。我使用了活动类CSS来显示：block，当它处于非活动状态时，它被设置为none。但我需要默认值

<Dropdown id="drp-main" className="seo-drp-menu seo-mob-drp">
<Dropdown.Toggle
    variant="success"
    id="drp-btn"
>
    {seo.linkTitle.map(
        (title, ind) => {
            return (
                <Link
                    to={`heading${ind}`}
                    spy={true}
                    offset={-150}
                    smooth={true}
                    duration={150}
                    activeClass="active"
                >   
                    <p>{title}</p>    
                </Link>
                )
        }
    )}
    <img
        src={EsArrowDown}
        height="1"
        width="1"
    />
</Dropdown.Toggle>

<Dropdown.Menu id="drp-menu">
    {seo.linkTitle.map(
        (fgl, fglIndex) => {
            return (
                <Dropdown.Item>
                    <div
                        className="ch-title"
                        onClick={() =>
                            onscrollClick(
                                `heading${fglIndex}`,
                                fgl
                            )
                        }
                    >   
                        <p>{fgl}</p>
                    </div>
                </Dropdown.Item>
            )
        }
    )}
</Dropdown.Menu>

{seo.linkTitle.map(
（标题，ind）=>{
返回(
{title}

)
}
)}
{seo.linkTitle.map(
（fgl，fglIndex）=>{
返回(
点击鼠标(
`标题${fglIndex}`，
fgl
)
}
>   
{fgl}

)
}
)}