如何使组件始终位于 react-leaflet 地图之上？答案

【问题标题】：How can I make component always on top of react-leaflet map?如何使组件始终位于 react-leaflet 地图之上？
【发布时间】：2021-06-30 20:50:12
【问题描述】：

现在，只有当我刷新页面时，表格才会显示一秒钟然后消失。我不知道它是否重要，但地图组件是一个反应传单地图。我想在地图上一直有一个组件。如何阻止它消失？

我的 css 文件：

.grid{
  height: 100vh;
} 

.map-box{
  position: relative;
  height: 100%;
}
.data-box{
  position: absolute;
  top: 20vh;
  height: 100%;
}

App.js 文件：

    <div className="App">
      <header className="App-header">
        <h2> </h2>
      </header>
      <body className="grid"> 
        <div className='map-box'> <Map /> </div>
        <div className='data-box'> <Data />  </div>
      </body>
    </div>
``

【问题讨论】：

标签： javascript css reactjs react-leaflet

【解决方案1】：

这是css的问题。尝试使用data-box 样式z-index，比如说10。

【讨论】：

如果您使用绝对位置，那么您也应该熟悉 z-index ;)