title: Vue leaflet rendering map partially
body: <p>I am trying to render a OpenStreet map by vue-leaflet. But I facing incomplete rendering problem. The map not showing with full view, rather it's loading partially and not sequentially.
  <a href="https://i.stack.imgur.com/kqfH9.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/kqfH9.png" alt="enter image description here" /></a></p>
  <p>Here is my code</p>
  <pre><code>&lt;template&gt;
    &lt;l-map
        v-show=&quot;loadingMap&quot;
        :zoom=&quot;zoom&quot;
        :center=&quot;center&quot;
        :options=&quot;{ zoomControl: false }&quot;
      &gt;
        &lt;l-tile-layer :url=&quot;url&quot;&gt;&lt;/l-tile-layer&gt;
      &lt;/l-map&gt;
  &lt;/template&gt;
  </code></pre>
  <p>I found in some stackoverflow answer, it's suggested to import leaflet.css and I added leaflet.css in main.js file. (for the sandbox example it's in index.html), but still it's not working</p>
  <p>How can I see the map fully &amp; with actual map view (not partially loaded like now).</p>
  <p>Codesandbox link: <a href="https://codesandbox.io/s/silent-glade-1yqe8?file=/src/App.vue:31-212" rel="nofollow noreferrer">https://codesandbox.io/s/silent-glade-1yqe8?file=/src/App.vue:31-212</a></p>