В моем коде у меня есть два компонента.
Видеолист
{this.state.videos.map((video) => { return <VideoListItem key={video.etag} video={video} /> })}
и фиксированная нижняя панель Navbar
<Navbar class="fixedBar" bg="light" fixed="bottom"> {/*Bootstrap*/}
<Navbar.Brand href="#home"></Navbar.Brand>
<Nav class="mr-auto right30 navbar-nav" >
<Button variant="primary" class="pull-left" text-align="right" >Select</Button>
</Nav>
</Navbar >
Однако панель навигации перекрывает содержимое при отображении содержимого. Я предполагаю, что это потому, что он рендерит его до того, как рендерит все видео. Есть ли у вас какие-либо предложения по устранению этой проблемы? Я думаю, что навигационная панель должна воспроизводиться каждый раз, когда я планирую видео, чтобы она знала, что такое дно. Но это может быть ненужным.
Я попытался обернуть его в div
, добавив padding-bottom
. Только код, который работает, удаляет fixed="bottom"
, но тогда мне нужно выяснить, как сделать панель навигации видимой из любой точки компонента.
Есть ли исправление для «повторного рендеринга», или я должен просто создать новый navbar с нуля?