One possible solution is to make the navbar sticky instead of fixed. Then adjust the body padding and set appropriate heights and overflow for the sidebar and content area.
Link to example
<div class="container-fluid sticky-top bg-dark shadow">
<div class="row collapse show no-gutters d-flex h-100 position-relative">
<div class="col-3 px-0 w-sidebar navbar-collapse collapse d-none d-md-flex">
<a href="#" class="navbar-brand">Brand</a>
</div>
<div class="col px-3 px-md-0 py-3">
<div class="d-flex">
<a data-toggle="collapse" href="#" data-target=".collapse" role="button" class="">
<i class="fa fa-bars fa-lg"></i>
</a>
<a href="#" class="ml-auto text-white"><i class="fa fa-cog"></i></a>
</div>
</div>
</div>
</div>
<div class="container-fluid px-0">
<div class="row vh-100 collapse show no-gutters d-flex h-100 position-relative align-items-start">
<div class="col-3 p-0 min-vh-100 text-white w-sidebar navbar-collapse collapse d-none d-md-flex sidebar">
<div class="navbar-dark bg-dark position-fixed h-100 w-sidebar">
<h6 class="px-3 pt-3">Fixed Menu</h6>
<ul class="nav flex-column flex-nowrap text-truncate">
<li class="nav-item">
<a class="nav-link active" href="#">Active</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
</ul>
</div>
</div>
<div class="col p-3 overflow-auto h-100">
<h3>Content..</h3>
</div>
</div>
</div>